選擇字符並換行

我在用jQuery將<sup>中的最後2個字符換成一段文字。我可以做一個console.log，它返回我想包裝的文本，但它永遠不會被包裝。代碼我真的很簡單：選擇字符並換行

// get text of heading 
var plansBlockHeading = $('.first .sub .one h4').text(); 

// filter to last 2 chars 
var sup = plansBlockHeading.substr(plansBlockHeading.length-2); 

// Wrap in a <sup></sup> 
$(sup).wrap("<sup />");

我明顯缺少一些簡單的東西，但我不知道是什麼。任何指針？

來源

2012-10-02 motoxer4533

您是否重新將其插入到DOM中，或者您是否期望您剛纏繞的字符串奇蹟般地出現在屏幕上？ – adeneo

看起來就像包裝文本，但不會將它附加到您的DOM的任何位置。此外，選擇器必須是HTML結構或元素..您似乎只是純文本包裝..嘗試將其直接附加到元素中。 –

一種慣用的jQuery的解決方案可能是這樣的：

$('.first .sub .one h4').html(function(i, html) { 
     // make sure there's no whitespace issues 
    html = $.trim(html); 
    return html.slice(0, -2) + "<sup>" + html.slice(-2) + "</sup>"; 
});

這裏假設h4內部沒有HTML標記（真的只是最後會是個問題）。

如果您有多個h4，這也可以正確處理。

來源

2012-10-02 19:21:52

這是完美的，它是我認爲最優雅的解決方案。謝謝！ – motoxer4533

不客氣。 –

var elem = $('.first .sub .one h4'), 
    text = elem.text(), 
    html = text.slice(0,-2) + '<sup>' + text.slice(-2) + '</sup>'; 
elem.html(html);

FIDDLE

來源

2012-10-02 19:10:36 adeneo

您只用最後兩個字符和新元素替換所有內容。我不認爲這是想要的。 –

@ user1689607 - 你可能是對的，但這就是OP在這個問題上做的事情，所以誰知道呢？ – adeneo

@ adeneo：是的，這是取代一切。不，這不是我想要解決的問題 - 這就是要求 - 獲得幫助;被動侵略性不需要。 – motoxer4533

我會用一個正則表達式

var text = $('.first .sub .one h4').text(); 
text = text.replace(/^(.*)(.{2,2})$/, "$1<sup>$2</sup>"); 
$('.first .sub .one h4').html(text);

http://jsfiddle.net/evPhf/

來源

2012-10-02 19:12:22

正則表達式似乎是矯枉過正不是嗎？我的意思是，你確切知道哪些角色是需要的，而且他們最後是對的。另外，除非你想看到標記，否則你應該使用'.html（）'而不是'text（）'來設置新的內容。最後，如果'h4'內有其他標記，它將會丟失。 –

這是一個簡單的問題的簡單解決方案。如果問題提到了H4有HTML，我會包括這一點。 –

看起來像正則表達式濫用給我。另外，當'h4'內的文本在最後2個字符之前包含換行符時，它會失敗。 –

選擇字符並換行

回答

相關問題