इसकी सामग्री के सटीक मिलान से तत्व का चयन करें

Question

सब ठीक है, मुझे आश्चर्य है कि अगर केवल टाइप करने वाले स्ट्रिंग के :contains()साथ तत्वों का चयन करने के लिए jQuery के चयनकर्ता बनाने का कोई तरीका है

उदाहरण के लिए -

<p>hello</p>
<p>hello world</p>

$('p:contains("hello")').css('font-weight', 'bold');

चयनकर्ता दोनों pतत्वों का चयन करेगा और उन्हें बोल्ड करेगा, लेकिन मैं चाहता हूं कि यह केवल पहले वाले का चयन करे।

Comments

ठीक है, आप :containsअपने स्वयं के कोड के साथ चयनकर्ता को ओवरराइड कर सकते हैं , लेकिन मुझे नहीं लगता कि आपका क्या मतलब है?

— ब्लेज़ेमॉन्गर

stackoverflow.com/questions/813477/…

— डोम

आप एक कस्टम चयनकर्ता को परिभाषित कर सकते हैं: stackoverflow.com/questions/12244929/…

— BLSully

संभावित डुप्लिकेट: Jquery चयनकर्ता, में बराबरी होती है

— बाइनरीटॉक्स

टेक्स्ट द्वारा सटीक लिंक का सटीक

— FishBasketGordo

Answer 1

नहीं, कोई jQuery (या CSS) चयनकर्ता नहीं है जो ऐसा करता है।

आप आसानी से उपयोग कर सकते हैं filter:

$("p").filter(function() {
    return $(this).text() === "hello";
}).css("font-weight", "bold");

यह चयनकर्ता नहीं है , लेकिन यह काम करता है। :-)

यदि आप "हैलो" से पहले या बाद में व्हॉट्सएप को संभालना चाहते हैं, तो आप $.trimवहां फेंक सकते हैं :

return $.trim($(this).text()) === "hello";

समयपूर्व ऑप्टिमाइज़र के लिए, अगर आपको परवाह नहीं है कि यह मेल नहीं खाता है <p><span>hello</span></p>और इसी तरह, आप सीधे कॉल का उपयोग करके $और इससे बच सकते हैं:textinnerHTML

return this.innerHTML === "hello";

... लेकिन आपको इसके लिए बहुत सारे पैराग्राफ रखने पड़ेंगे, इतने सारे कि शायद आपके पास पहले दूसरे मुद्दे हों। :-)

Comments

$.trimतुलना करने से पहले किसी भी आवारा व्हाट्सएप की भी इच्छा कर सकते हैं।

— ब्लेज़ेमॉन्गर

किसी कारण से मुझे "===" के बजाय "==" का उपयोग करना पड़ा।

— स्टीफन

@ स्टेफ़न: यदि आप किसी संख्या के साथ तुलना कर रहे थे, तो आपको या तो नंबर का उपयोग करना होगा ==( == 2या एक स्ट्रिंग में) डाल देना चाहिए === "2", क्योंकि आपके द्वारा प्राप्त मूल्य text()या innerHTMLहमेशा एक स्ट्रिंग है। यदि आप एक स्ट्रिंग के साथ तुलना कर रहे थे, तो इससे कोई फर्क नहीं पड़ता कि आप उपयोग करते हैं ==या नहीं ===।

— टीजे क्राउडर

यह एक शर्म की बात है कि jQuery लागू किया है :containsजो अधिक जटिल है, लेकिन सटीक पाठ मैच के लिए चयनकर्ता को लागू नहीं किया है। = {

— पाउलो बुएनो

Answer 2

एक विस्तारित छद्म फ़ंक्शन जोड़ने का प्रयास करें:

$.expr[':'].textEquals = $.expr.createPseudo(function(arg) {
    return function( elem ) {
        return $(elem).text().match("^" + arg + "$");
    };
});

तो आप कर सकते हैं:

$('p:textEquals("Hello World")');

Comments

महान समाधान: थोड़ा अतिरिक्त: यह सुनिश्चित करने के लिए कि आप एक मौजूदा $.expr[':'].textEquals = $.expr[':'].textEquals || $.expr.createPseudo(function(arg) {

— एक्सपायर को

Answer 3

इसे प्राप्त करने के लिए आप jQuery के फ़िल्टर () फ़ंक्शन का उपयोग कर सकते हैं ।

$("p").filter(function() {
// Matches exact string   
return $(this).text() === "Hello World";
}).css("font-weight", "bold");

Answer 4

तो अमांडू का जवाब ज्यादातर काम करता है। जंगली में इसका उपयोग करते हुए, हालांकि, मैं कुछ मुद्दों में भाग गया, जहां चीजें जो मुझे मिलने की उम्मीद थी, वे नहीं मिल रही थीं। ऐसा इसलिए था क्योंकि कभी-कभी तत्व के पाठ के आसपास यादृच्छिक सफेद स्थान होता है। यह मेरा विश्वास है कि यदि आप "हैलो वर्ल्ड" की खोज कर रहे हैं, तो आप फिर भी "हैलो वर्ल्ड" या "हैलो वर्ल्ड \ n" से मैच करना चाहेंगे। इस प्रकार, मैंने फ़ंक्शन में "ट्रिम ()" विधि को जोड़ा, जो आसपास के व्हाट्सएप को हटा देता है, और यह बेहतर काम करना शुरू कर देता है।

विशेष रूप से ...

$.expr[':'].textEquals = function(el, i, m) {
    var searchText = m[3];
    var match = $(el).text().trim().match("^" + searchText + "$")
    return match && match.length > 0;
}

इसके अलावा, ध्यान दें, यह उत्तर पाठ द्वारा सटीक लिंक (सटीक मिलान) के समान है

और माध्यमिक नोट ... trimकेवल खोजे गए पाठ से पहले और बाद में व्हाट्सएप को हटा देता है । यह शब्दों के बीच में व्हाट्सएप को नहीं हटाता है। मेरा मानना ​​है कि यह वांछनीय व्यवहार है, लेकिन आप इसे बदल सकते हैं यदि आप चाहते थे।

Answer 5

मुझे एक रास्ता मिला जो मेरे लिए काम करता है। यह 100% सटीक नहीं है, लेकिन यह उन सभी तारों को समाप्त कर देता है, जिनमें केवल मेरे द्वारा खोजे जा रहे शब्द से अधिक है क्योंकि मैं स्ट्रिंग के लिए जाँच करता हूं जिसमें व्यक्तिगत स्थान भी नहीं हैं। वैसे आपको इन "" की आवश्यकता नहीं है। jQuery जानता है कि आप एक स्ट्रिंग की तलाश कर रहे हैं। सुनिश्चित करें कि आपके पास केवल एक स्थान है: इसमें () भाग है अन्यथा यह काम नहीं करेगा।

<p>hello</p>
<p>hello world</p>
$('p:contains(hello):not(:contains( ))').css('font-weight', 'bold');

और हाँ मुझे पता है कि अगर आपके पास सामान है तो यह काम नहीं करेगा <p>helloworld</p>

Comments

एक फिल्टर या एक्सटेंशन का उपयोग किए बिना (..) के साथ सरल मैचों के चालाक उपयोग! पहले (।।) में रिक्त स्थान की आवश्यकता वाली किसी भी चीज़ पर काम नहीं करेगा, लेकिन इसके लिए एक समाधान के साथ आने की कोशिश कर रहा है। धन्यवाद!

— जोपीसी

Answer 6

टीजे क्राउडर जैसा ऊपर कहा गया है, फिल्टर फ़ंक्शन चमत्कार करता है। यह मेरे लिए मेरे विशिष्ट मामले में काम नहीं कर रहा था। मुझे एक div (इस मामले में एक jQuery संवाद) में कई तालिकाओं और उनके संबंधित td टैग खोजने की आवश्यकता है।

$("#MyJqueryDialog table tr td").filter(function () {
    // The following implies that there is some text inside the td tag.
    if ($.trim($(this).text()) == "Hello World!") {
       // Perform specific task.
    }
});

मुझे आशा है कि यह किसी के लिए उपयोगी है!

Comments

मैं jquery के लिए बहुत नया हूँ, लेकिन लगता है कि फ़िल्टर के बजाय प्रत्येक () का उपयोग करना थोड़ा बेहतर होगा क्योंकि फ़िल्टर का लक्ष्य एक सबर्रे वापस करना है। लेकिन निश्चित रूप से समाधान को प्रेरित किया, जैसा कि मेरे पास एक ही मुद्दा था :)

— ज्येष्ठतम

Answer 7

एक लाइनर जो jQuery के लिए वैकल्पिक पुस्तकालयों के साथ काम करता है :

$('p').filter((i, p) => $(p).text().trim() === "hello").css('font-weight', 'bold');

और यह एक jQuery के a:contains("pattern")चयनकर्ता के बराबर है :

var res = $('a').filter((i, a) => $(a).text().match(/pattern/));

Answer 8

.First () यहां मदद करेगा

$('p:contains("hello")').first().css('font-weight', 'bold');

Comments

ज़रूर ... इस विशिष्ट मामले में। क्या होगा अगर आदेश देव समय पर ज्ञात नहीं है?

— BLSully