मैं jQuery का उपयोग करके किसी तत्व के आंतरिक पाठ के अंतिम शब्द के चारों ओर एक अवधि को कैसे लपेटूं?

Question

मुझे पता है कि यह एक साधारण काम होना चाहिए, लेकिन मुझे अंतिम शब्द शीर्षक शीर्षक चुनने में समस्याएं आ रही हैं और एक अवधि में लपेटने में समस्याएं हैं ताकि मैं शैली में बदलाव जोड़ सकूं।

यहाँ बहुत सराहना

Answer 1

समस्या यह है कि jQuery वस्तुओं रैप डोम नोड्स है जो मैं अब तक

$('.side-c h3').split(/\s+/).pop().wrap('<span />'); 

किसी भी मदद की हो जाएगा है। तत्व में प्रत्येक शब्द एक डोम नोड स्वयं नहीं है, इसलिए आपको टेक्स्ट को अलग करने और फिर से जुड़ने के लिए थोड़ा और काम करने की आवश्यकता होगी। आपको jQuery द्वारा चुने गए एकाधिक नोड्स के लिए भी खाते की आवश्यकता है। इसे आज़माएं:

$('.side-c h3').each(function(index, element) { 
    var heading = $(element), word_array, last_word, first_part; 

    word_array = heading.html().split(/\s+/); // split on spaces 
    last_word = word_array.pop();    // pop the last word 
    first_part = word_array.join(' ');  // rejoin the first words together 

    heading.html([first_part, ' <span>', last_word, '</span>'].join('')); 
}); 

Answer 2

हम्म, यह विशेष रूप से आसान नहीं है। ऐसा करने का सबसे रूढ़िवादी रास्ता DOMNode.splitText साथ है:

$('.side-c h3').each(function(){ 
    var oldNode = this.firstChild, 
     newNode = oldNode.splitText(oldNode.data.lastIndexOf(' ') + 1), // don't wrap the space 
     span = document.createElement('span'); 

    this.replaceChild(span, newNode); 
    span.appendChild(newNode); 
}); 

See jsfiddle।

Answer 3

यह यह करता है:

$('.side-c h3').each(function(){ 
    var $this = $(this), text=$this.text().trim(), words = text.split(/\s+/); 
    var lastWord = words.pop(); 
    words.push('<span>' + lastWord + '</span>'); 
    $this.html(words.join(' ')); 
});