如何枚举所有具有相同ID的div标签？

Question

我有基于小部件的网页,我给了所有div相同的ID属性.加载页面后,我想枚举所有与ID元素'widget'匹配的div元素.我正在使用jQuery.

然后我想得到'widget'div中的内部div属性,它将被用作工具提示.

<div id="widget" class="span-8  "  >

<h2><a href="">Example.com</a></h2>
<ul>
        <li><h3><a href="example.com">Example News 1</a></h3>
    <div id="tooltip-content">              
        <div class="published">Thu Jul 8, 2010</div>
        <div class="content">
            This detail news 1 shown only on tooltip.. 
        </div>
    </div>
    </li>

    <li><h3><a href="example.com">Example News 2</a></h3>
    <div id="tooltip-content">              
        <div class="published">Thu Jul 8, 2010</div>
        <div class="content">
            This detail news 2 shown only on tooltip.. 
        </div>
    </div>
    </li>               
</ul>

基本上我想得到id为'widget'的所有小部件(我每页有大约20个小部件)并获得所有与小部件中的'tooltip-content'匹配的div.一个小部件有5或6个工具提示内容.你能帮我列举一下div吗？

Answer 1

ID应该在文档中是唯一的; 你应该每个ID只有一个元素.见w3schools

id必须在HTML文档中是唯一的.

您要做的是class在每个元素上使用属性,然后根据类名进行选择.如果你使用的是Prototype,jQuery或Ext(或你喜欢的另一个)这样的框架,那么应该有一个通过CSS选择器或类名选择元素的方法.我建议你widget为每个元素添加一个调用的类,并为它们提供唯一的ID,

Answer 2

我给了所有div相同的ID

这是你的问题.根据定义,id必须是唯一的.如果它不是唯一的那么你会遇到各种各样的问题(比如不能轻易地枚举它们).相反,您可以使用该class属性(单个元素可以通过用空格分隔多个类,所以class="widget span-8"很好).

然后,您可以使用jQuery的基于类的选择器来轻松枚举:

$(".widget").each(function() {
    ...
});