jquery - 使用 jquery 访问普通文本

Question

我有以下 HTML 代码：

<div class="top_l">
    <a class="shou" onclick="" href="">11</a> | 
    <img border="0" class="" src="/">XXXXXX<a href=""></a> | 
    <a href=""></a> | 
    <a href=""></a> 
</div> 

如何使用 jQuery（使用什么选择器）获取文本 XXXXXX？

Answer 1

You can only select element nodes with jQuery. And most jQuery methods only consider element nodes, so using jQuery and plain DOM API together might be a good approach here.

The text node you want to target is the next sibling of the image. So if you can get a reference to the image element, you can access the text node with the .nextSibling ^[MDN] property:

var txt = image.nextSibling.nodeValue;
// or if image is a jQuery object
var txt = image.get(0).nextSibling.nodeValue;

Given the structure of the HTML, you could do something like this:

var txt = $('.top_l > img').get(0).nextSibling.nodeValue;

DEMO

Answer 2

你有很多解决方案，我再添加一个:)

var divVar=$(".top_l").clone();
divVar.children().addClass("remove");
divVar.children().remove(".remove");
var txt=divVar.html();
txt=txt.replace (/\|/g, '');

JSFIDDLE

Answer 3

你可以这样做：

var childNodes = document.querySelector("div").childNodes, pickNext = false;
for(var i in childNodes) {
    var childNode = childNodes[i];
    if(pickNext) {
        alert(childNode.nodeValue);
        break;
    }
    // same as $(childNode).is("img")
    // now you can put the XXXXXX where ever you want.
    // as far as you know which is the next sibling.you can get it
    if(childNode.nodeName === "IMG") {
        pickNext = true;
    }
}

通过这种方式，只要您知道兄弟节点的节点类型，您就可以在任何地方找到文本。

免责声明：这在 IE 中可能不起作用。

演示

Answer 4

好吧，您必须将它放在一个 html 标记中并使用 jquery 调用该标记，请参见下面的示例。

<img src = "abcd.png" /> <span>XXXXXX</span> <br />etc etc<and some more HTML code>

在你的jQuery中

$(document).ready(function(){
alert($("span").text());
});

在 jquery 中，您可以使用 css 选择器来选择标签

<img src = "abcd.png" /> <span id="theText">XXXXXX</span> <br />etc etc<and some more HTML code>

$(document).ready(function(){
alert($("#theText").text());
});