Question

我有这个简单的HTML：

<div id="tree">
    <div class="roi">
        <ul>
            <li>text1</li>
            <li>text2</li>
            <li>text3
                <ul>
                    <li>insideText1<li>
                    <li>insideText2<li>
                </ul>
            </li>
        </ul>
    </div>
</div>

我想只获得项目“text2”和项目“insideText2”; 所以我试着写道：

var Tree=document.getElementById("tree").document.getElementsByTagName("UL");

但我不知道如何到达包含“text2”和“insideText2”的特定li。请帮忙。感谢。

Answer 1

假设JQuery

//text2
alert($('div#tree ul > li:eq(1)').text())

//insideText2
alert($('div#tree ul > li > ul li:eq(1)').text())

Answer 2

只有一个文档对象，所以你几乎只有var Tree=document.getElementById("tree").document.getElementsByTagName("UL");，只需删除第二个document：

var Tree=document.getElementById("tree").getElementsByTagName('ul');

在Chrome控制台中尝试了这个页面

document.getElementById('question').getElementsByTagName('td');

像魅力一样工作

<强>更新

这很简单...... getElementsByTagName()方法返回一个nodeList（不仅仅是任何旧数组）。上面的代码提供了元素中具有'ul'标记的所有ul元素的列表。您可以遍历列表中的所有ul标记，并检查包含无序列表或某个innerText / innerHTML的li子项。我会在一分钟内给你一个快速的例子。

检查this jsfiddle是否有工作示例。尽可能多地玩它，让我知道你还有什么不完全清楚...干杯

Answer 3

如果您想访问“text2”li，请使用：

document.getElementsByTagName('li')[1]

项目“insideText2”将是

document.getElementsByTagName('li')[2].getElementsByTagName('li')[1]

javascript中childNode的ChilNode的树

3 个答案: