1

我想知道 innerText 属性。考虑以下标记：

HTML

<div class="myClass">
    <div>
         <div>foo</div>
   </div>
</div>
<div class="myClass">
    <div>
         <div>bar</div>
    </div>
</div>

然后，让我们运行以下代码：

JS

var a = document.querySelectorAll('div.myClass');
//var a = document.querySelectorAll('div.myClass div div');
for (var i=0; i<a.length; i++){
    console.log(a[i].innerText);
    if (a[i].innerText == "foo"){
        console.log("found");
    }
}

在这里提琴

按原样运行此代码，输出foo和空行，然后bar.

如果我注释掉脚本的第一行，然后取消注释第二行，然后在包含文本的 div 的确切级别上关闭，则此代码输出foo, found, bar。

我的问题是：如果在第一次迭代中脚本输出foo，为什么a[i].innerText == "foo"不是true？哦，那条空行是从哪里来的？

4

2 回答 2

3

由于 myClass 内部有 2 个 div，javascript 将它们视为一行“\n”，因此“foo”不等于“foo\n”

但是，如果我们像这样更改代码：

 if (a[i].innerText == "foo\n"){
        console.log("found");
 }

然后您可以在控制台中看到找到的日志。 http://jsfiddle.net/3149ha75/5/

于 2014-08-17T08:32:59.410 回答
0

作为 Halil Bilgin 答案的替代方案，您可以trim将内部文本删除\n

在这个例子中，我使用了jQuery.trim()：

for (var i=0; i<a.length; i++){
    console.log(a[i].innerText);
    if (jQuery.trim(a[i].innerText) == "foo"){
        $("pre").text("found:"+a[i].innerText);
        console.log("found");
    }
}

http://jsfiddle.net/82L9g868/2/

于 2014-08-17T08:37:10.970 回答