Question

我正在学习jQuery而且我得到了这个＆＃39; undefined＆＃39;使用:eq()选择器时出错这是HTML：

<!DOCTYPE html>
<html>
<head>
    <title>:eq() selector example</title>
</head>
<body>
    <div>
        <button>Button #1</button>
        <button>Button #2</button>
        <button>Button #3</button>
        <button>Button #4</button>
        <button>Button #5</button>
        <button>Button #6</button>
    </div>

    <script src="jquery-2.1.4.min.js"></script>
    <script src="script.js"></script>
</body>
</html>

脚本：

var myButton = $('button:eq(5)');
console.log(myButton.textContent);

当我使用var myButton = $('button')[5];时，一切都很好。

Answer 1

$('button:eq(5)')返回没有textContent属性的jQuery对象，因此您应该使用text()来获取元素文本：

var myButton = $('button:eq(5)');
console.log(myButton.text());

当$('button')[5];返回DOM对象时，您可以访问其上的属性textContent：

var myButton = $('button')[5];
console.log(myButton.textContent);

希望这有帮助。

Answer 2

使用jquery对象text()。selector $('button:eq(5)');返回一个jquery对象。textContent是一个Dom对象。是不可接受的。

var myButton = $('button:eq(5)');
console.log(myButton.text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <button>Button #1</button>
  <button>Button #2</button>
  <button>Button #3</button>
  <button>Button #4</button>
  <button>Button #5</button>
  <button>Button #6</button>
</div>

或

如果您需要两者的组合，请尝试这样

$('button:eq(5)')[0].textContent

Answer 3

$('button')[5]返回具有textContent属性的DOM元素的引用，因此它可以工作。

但是$('button:eq(5)')是一个jQuery对象，它没有属性，因此返回 undefined 。

对jQuery对象使用.text()函数。

var text = $('button:eq(5)').text()

：eq（）选择器返回undefined

3 个答案: