jQuery 跨度类选择器答案

【问题标题】：jQuery span class selectorjQuery 跨度类选择器
【发布时间】：2015-03-24 15:05:57
【问题描述】：

我有一个跨度，里面有一个文本，例如：

<span class="characters-count">&#40;160 Characters Left&#41;</span>

在这种情况下给定了一个类.characters-count，当我尝试使用 jQuery 类选择器来获取跨度内的文本时：

$(".characters-count")[0].text();

它返回未定义的！

但是这个选择器效果很好：

$("span.characters-count").text();

谁能解释发生了什么？

【问题讨论】：

你似乎认为选择器有什么不同，但是为什么你的行中有[0]不起作用？
您的代码 $(".characters-count")[0].text(); 不应该用于检查控制台是否有错误
@nnnnnn 抱歉我没听懂，你到底是什么意思？
仔细查看您自己的代码 - 不起作用的行在 .text() 之前有 [0]。为什么？
@nnnnnn 因为类选择器将返回一个列表

标签： javascript jquery html jquery-selectors

【解决方案1】：

$("span.characters-count").text();

在我们的例子中，您使用具有 text 方法的 jQuery 对象

$(".characters-count")[0].text();

在这种情况下，您使用没有text 方法的actual DOM element（如document.getElementByClassName('characters-count')[0]）

【讨论】：

【解决方案2】：

使用

$(".characters-count").text();

Demo

【讨论】：

【解决方案3】：

console.log($(".characters-count:first").text())

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="characters-count">&#40;160 Characters Left&#41;</span>

试试这样的：

$(".characters-count:first").text()

检查这里，为什么它不适合你。

//This will return dom element, so it doesn't have `text()` method, that's why it was throwing error for you.
    console.log($(".characters-count:first")[0]); 


// This will return object of an element, you can use jQuery selectors to get first element from collection and set text to it
     console.log($("span.characters-count"));
     console.log($("span.characters-count:first").text

);

【讨论】：

【解决方案4】：

在使用 $(".characters-count")[0] 时需要使用 innerText 而不是 text() 检查DEMO

 $(".characters-count")[0].innerText

【讨论】：

您应该在提交之前尝试您的解决方案。
@ProllyGeek 我认为你需要检查我的小提琴
对不起，我一直有一个类型 innerHtml 而不是 innerHTML ，感谢您指出。