0

我有这样的东西

<div id='container0'>
    <input id='item0'>
</div>


<div id='container1'>
    <input id='item0'>
</div>

我想选择第二个 item0（div container1 中的那个）并将它的 id 更改为 item1。最好的方法？有没有办法可以选择页面上的所有 item0，然后检查它们的容器 div 并确保它与“container1”匹配？

感谢您的时间。

4

4 回答 4

3

具有多个相同的元素id 是无效的。所以这里正确的解决方案是：修复它。（通常使用 aclass代替，但还有其他选项。）

也就是说，您可以使用querySelector：

var elm = document.querySelector("#container1 #item0");

但是由于结构无效，结果会因实现而异，如果很多（甚至大多数）返回我不会感到惊讶null。

再次警告说，真正的解决方案是修复无效的副本id，它可能比上面的更可靠，getElementById用于获取container1元素，然后循环遍历其子节点以查找与id == "item0".

于 2013-09-29T21:47:56.580 回答
2

在两个元素上具有相同的id属性是语法错误，因此您应该修复标记。违反规则时，浏览器行为未定义。

如果由于某种奇怪的原因无法修复错误，您仍然可以找到带有 的元素id=container1，如果该id属性是唯一的，然后选择它的第一个子元素，如果标记与问题中给出的完全一致。

于 2013-09-29T21:49:23.630 回答
1

我知道你没有用 jQuery 标记它——但我认为它可能是一个解决方案。那么给每个 div 一个类，然后用 jQuery 运行一个 each-loop 呢？

<div id='container0' class='container'>
    <input id='item0' class='item'>
</div>


<div id='container1' class='container'>
    <input id='item0' class='item'>
</div>

然后我认为每个循环可以像这样处理它：

$('div.container').each(function(key, value) { 
    var elmid = $("#"+key + " div.item).attr('id');
    var containerid = $(this).attr('id');

    var newelmid = elmid.replace('item','');    
    var newcontainerid = elmid.replace('container',''); 

    if(newelmid != newcontainerid)
    {
        $("#"+elmid).attr('id', 'item'+newcontainerid);
    }

});

让我知道这是否接近您想要做的:)

于 2013-09-29T21:51:52.277 回答
0

正如其他人提到的，您不能为多个元素使用相同的 id。但是，您可以使用相同的名称。在更正多个 id 的语法问题以使每个 id 都唯一之后，您可以根据它所在的容器选择第二个输入元素。我会为此使用 jQuery。

例如（请注意，我不在电脑前 - 我在手机上，因此可能需要对语法进行一些细微的更改）：

$("#container1 > input[name='item']").attr('id', 'item1')

对于 jQuery 选择器，请看这里：http ://api.jquery.com/category/selectors/

要更改属性，请看这里：http ://api.jquery.com/attr/

于 2013-09-29T22:30:13.010 回答