jQuery：查找包含嵌套ul的列表项的文本
我有以下内容：
- item1
- sub1
- sub2
我想回复一个点击事件并在其他地方使用li的文本。 但是，如果单击是包含嵌套ul的li，我当然会得到所有元素的文本。
$("#list li").click(function() { alert($(this).text()); });
按预期返回item1sub1sub2。
如果单击项目1 li，我无法弄清楚如何获得’item1’。 我尝试了以下（除其他事项外）没有运气：
$("#list li").click(function() { alert($(this).filter("ul").text()); });
有任何想法吗？
编辑
这是一个例子的片段 – 它可能是多层次的深度。 我也不想在列表或其他标记中包装列表项文本。
这种方法怎么样？ 克隆对象，删除克隆的子项， 然后查找文本内容。
$("#list li").click(function () { alert($(this).clone().children().remove().end().text()); }
也许不是最有效的方法，但它完全直观，非常整洁，你不必捣乱你的HTML。
普通的DOM方法只允许访问一个元素的文本内容，而不是jquery：
$("#list li").click(function() { alert($(this)[0].firstChild.textContent) });
在这种情况下，firstChild是li元素下面的textNode
你很难，因为text()做了它应该做的事情 – 返回这个和所有子元素的文本。 最简单的方法是为每个
添加另一个标记，并使用此标记。
例如：
- item1
- sub1
- sub2
然后你有一个简单的选择器：
$("#list li").click(function() { alert($(this).find("span").eq(0).text()); });
或者，如果可能（取决于您的风格），您可以将事件添加到范围：
$("#list span").click(function() { alert($(this).text()); });
如果您不能添加这些 （如您所说），您可以使用jQuery的.contents()为您添加它们，类似于此处所做的：
在
A
B 中隐藏B.
这将检查列表项是否包含任何子项，如果是，则仅过滤掉文本节点并连接结果（在这种情况下，它将适用于文本元素，无论它们放在li中）。 如果您只想在开始时检查元素，则可以避免使用for循环并使用this.firstChild
$("#list li").click(function(e) { if ($(this).children().length > 0) { var text = ""; for (var i = 0; i < this.childNodes.length; i++) { var node = this.childNodes[i]; if (node.nodeType === 3 && $.trim(node.nodeValue).length > 0) { text += $.trim(node.nodeValue); } } alert(text); } else { alert($(this).text()); } e.stopPropagation(); });
因此，这个机制从子元素中提取html，用任何内容替换换行符，然后只将字符串返回到第一个“ < ”字符。 我还添加了event.stopPropagation以避免调用click事件冒泡到父级。
我认为你需要使用每种方法。 所以尝试以下脚本：
$(document).ready(function() { $('ul').each(function() { $(this).find('li').click(function() { var listItem = this; alert($(listItem).text()); }); }) });
使用以下标记
- 1
- 2
- 3
- 4
实现同样的另一种方式
$("#list li").click(function() { alert($(this).contents().not('ul,ol').text()); });