开发者

How to find text nodes with jquery

how can i select all text nodes with a textpa开发者_如何学Cttern.

Example:

<html>
<body>
<div>test</div>
<button>test</button>
<span title="test"></test>
</body>
</html>

$(select all nodes with text "test")


You're looking for the :contains selector:

$('*:contains(test)')

Note that this won't search attributes.


If you're talking about 'test' in the class name:

var elements = $('[class]*="test"');

Or if you're talking about 'test' in the text of the element:

var elements = %('*:contains("test")');


Previously answered here:

Find text string using jQuery?

(Short answer from the above stackoverflow question) ... use the :contains filter.


I believe you want to use the contains() Selector.


The way #1

One of the standard filters for selecting elements based on their content is the :contains(text) filter. It matches all elements which contain the given text. Its major flaw is that it’s case-sensitive by default. Personally, most of the time I don’t need a text comparison to be case-sensitive. It is in general more intuitive for the end-users to find the text they type no matter the casing. Quite a few people on the Internet agree with me on this one. It was only a matter of time when the case-insensitive version of the :contains filter appeared on the Internet. An example of the alternative version is:

jQuery.extend(
    jQuery.expr[':'], {
        Contains: "jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0"
    } 
);

By converting both the selected text and the text that you’re looking for to upper case before matching you can simulate a case-insensitive search. The only difference between using the case-sensitive and case-insensitive version as defined above is the capital letter C in the filter’s name. Of course you could change it to anything else what would make sense to you and other people working with your code.

The way #2

As you might’ve noticed in the JavaScript snippet above, the contains filter uses indexOf method of string to check whether the given string contains a particular piece of text or not. While this method is sufficient in most situations you may face scenarios when a simple match is not enough. Using Regular Expressions might be just the answer you’ve been looking for.

It’s quite surprising that jQuery doesn’t ship with support for Regular Expressions. I would definitely agree that they aren’t an answer to everything and you should use them wisely. But if you want to use them, and you have a good reason to do so, they are not there. Luckily it’s not that difficult to extend jQuery with an extra Regular Expressions-based Content Filter.

jQuery.extend(
    jQuery.expr[':'], {
        regex: function(a, i, m, r) {
            var r = new RegExp(m[3], 'i');
            return r.test(jQuery(a).text());
        }
    }
);

Believe it or not, but the few lines of code above is all you need to extend jQuery with support for regular expression text matches. What the above does is to define a new filter called regex. Each time the filter is called, it creates a new Regular Expression using the value passed as the parameter of the filter. Additionally the expression will use a case-insensitive match (you could remove it by deleting the i from the second parameter of RegExp constructor). If the text of the current DOM object matches the expression the object will be added to the array of matches.

You can use the regex filter as follows:

$("p:regex('[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}')")

The example above would return all paragraphs which contain an e-mail address.

These two ways extend jQuery with a :contains and :regex filters (as author said, jQuery ships with quite a few filters: http://api.jquery.com/category/selectors/).

via

There is also a :regex filter plugin if you wish.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜