使用jQuery获取目标文本

Question

尝试从无序列表中获取事件目标元素的文本

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

像这样的代码

$('ul').click(function() {
theEl=(event.target.text);
});

当我控制台记录

event.target

它返回

 <li>Item 1</li>

并且

event.target.text

返回 undefined。我只想要 'Item 1'。我知道我以前做过这个 - 现在可能太晚了...谢谢任何帮助 :)

- Charles Wyke-Smith

Answer 1

使用jQuery的text函数：

$(event.target).text()

- JeffB

Answer 2

你混淆了原始JS和jQuery。

在jQuery中，你需要使用$(event.target).text()

然而，在JavaScript中更加高效：event.target.firstChild.nodeValue

编辑：这里有一个JSPerf来证明。

- Niet the Dark Absol

---

好的 JSPerf - 在 JS 中速度更快！将 Jeff 的回答标记为正确答案，因为他是第一个回答，但感谢您提供的详细信息。 - Charles Wyke-Smith

Answer 3

event.target.text 未定义的原因是因为 HTMLElement 没有定义该方法或属性。然而，jQuery 有 text() 方法，这就是你要找的。要访问 jQuery 的方法或属性，需要将当前 HTMLElement 包装在一个 jquery 对象中。这可以通过将其传递给 jQuery 来完成，然后创建一个带有它的函数对象和公开 API 的 jQuery 原型。

jQuery(element);//in general
$(event.target).text();//for your situation

- Travis J

Answer 4

event.target.textContent

这也是 JavaScript 访问的方式。我建议您使用“Chrome”（或 Firefox）的 javascript 控制台并按下 Ctrl+Shift+J。在代码中输入：console.log(event) 并观察控制台输出。您可以查看对象的每个属性。

- kahonmlg

Answer 5

尝试一下 -> event.target.innerText

- Karthik Sagar

Answer 6

纯JS解决方案：

event.target.options[event.target.selectedIndex].text

- Jeremy Lynch