Javascript:按标签类型获取子项

IAm*_*aja 12 javascript jquery

我有一种情况,服务器端正在生成表单的结果HTML:

<div id="myDiv">
    <ul>
        <li class="imageElem">
            <img src="..."/>
            <div id="imgInfo">
                <p class="imgDetail">
                    Image Title #1
                </p>
            </div>
        </li>

        <!-- Etc. for many images (1 <li> per <img>) -->

    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

我试图循环这个列表并使用jQuery执行动态DOM操作.我遇到了三个瓶颈:

  • 如何获得既没有或者(并且改变服务器端代码以产生其中一个myDiv的单个<ul>孩子将是一场噩梦); 和idclass
  • 如何获得每个<li>的单一<img>的孩子; 与上面相同,用于使服务器生成id/class属性; 和
  • 如何获取每个孩子的<li>单个<p>文本(例如"图像标题#1")

我正在尝试以下(分别针对这三个问题中的每一个)无济于事:

var myDivUL = document.getElementById("myDiv").ul;
for(i = 0; i < myDivUL.length; i++)
{
    var currImageElem = myDivUL[i].img;
    var currPText = myDiv[i].div.p.text;

    // ... rest of function omitted for brevity
}
Run Code Online (Sandbox Code Playgroud)

我在这做错了什么?在没有id/class属性访问权限的情况下,我需要更改以获取三个元素?提前致谢!

Piy*_*esh 12

你可以做这样的事情

var myDivUL = document.getElementById("myDiv").getElementsByTagName('ul')[0];
Run Code Online (Sandbox Code Playgroud)

等等,关键是在任何html元素上使用getElementsByTagName().


小智 7

你可以得到这样的东西:

$("#myDiv").find("ul:not([id],[class])").each(function()
{
    $(this).find("li").each(function(){
       var IMG = $(this).find("img:not([id],[class])");
       var PText = $(this).find("p.imgDetail").text();
    });
})
Run Code Online (Sandbox Code Playgroud)