Jquery .text（）函数行为

Question

我有这个html片段：

<div clas="some-div">
  <span class="same-class">text 1</span>
  <span class="same-class">text 2</span>
</div>

我想将 text1 和 text2 提取为两个不同的变量。

var allText = $('.same-class').text(); //gives text 1text2
var t1 = $('.same-class')[0].text(); //gives error

.text（）功能如何表现？

Answer 1

您必须使用.eq()来实现此目的，

var t1 = $('.same-class').eq(0).text(); 

如果使用括号表示法根据索引访问元素，那么它将返回一个普通的node对象。并且它的原型中不包含名为text的函数。

如果您仍想使用括号表示法，请执行

var t1 = $('.same-class')[0].textContent; 

Answer 2

您也可以使用$.each()，例如：

var textArr = []; //array to store text
$('.same-class').each(function(idx, val) {
    textArr.push($(this).text());
});
console.log(textArr);

Answer 3

jQuery doc：

中文字（）的说明

  

描述：获取匹配元素集合中每个元素的组合文本内容，包括它们的后代。

由于jQuery对象$（'。same-class'）包含多个元素，因此它将所有元素的文本组合成一行。

为了获取特定元素文本：.eq()

$('.same-class').eq(0).text();

方法