Question

如何使用javascript动态命名id？

这样的事情：

JS：

var idName = "fruit";

HTML：

<img id="javascript:idName" src="banana.jpg">

Answer 1

var bananaImage = new Image();
bananaImage.id = "fruit";
bananaImage.src = "banana.jpg";

Answer 2

使用jQuery框架，您可以执行以下操作：

<img class="idName" src="banana.jpg"/>
<img class="idName" src="cherry.jpg"/>

剧本......

var idName = 'fruit';

$(function() {
    $('img.idName').each(function(i) {
        $(this).attr({id: idName+i});
    });
});

...导致：

<img id="fruit0" class="idName" src="banana.jpg"/>
<img id="fruit1" class="idName" src="cherry.jpg"/>

Answer 3

您可以动态创建元素，例如<img>，并使用JavaScript DOM API设置其属性。

Answer 4

或者你可以通过其他任何方式获取元素IE

imgs = container.getElementsByTagName("img");
foreach(imgs as img){
    if(imgs.src == "banana.jpg") img.id = "fruit";
}

注意：foreach在JS中不起作用，你需要一个for循环，但我太懒了：P

Answer 5

我认为这就是你要找的东西。您需要某种事件来触发JavaScript。由于IMG没有它，除了用户事件，你需要这样的东西：

<head>
<script language="JavaScript" type="text/javascript">
function nameMyIds() {
   var idToName = "firstImageId";
   var theImage = getImageBySrc("banana.jpg");
   if (theImage!=null)
       theImage.id = idToName;
}
function getImageBySrc(src) {
    // using DOM, using jQuery would make this easier
    var allImages = document.body.getElementsByTagName("IMG");
    for (var i=0; i<allImages.length; i++ ) {
        var img = allImages[i];
        var i = img.src.indexOf(src);
        if (img.src == src || img.src.indexOf(src) > 0) { return img };
    }
}
</script>
</head>
<body onload="nameMyIds()">
    <img src="banana.jpg">
</body>

使用javascript动态命名id？

5 个答案: