jQuery標(biāo)簽替換函數(shù)replaceWith()的使用例子
replaceWith簡(jiǎn)單使用
jQuery中，有一個(gè)強(qiáng)大的替換函數(shù)replaceWith()，使用非常簡(jiǎn)單，如：
頁(yè)面有如下p標(biāo)簽
把所有p標(biāo)簽替換為“##”
$('p').replaceWith('##');
執(zhí)行后的結(jié)果：
替換標(biāo)簽
利用這個(gè)replaceWith，我們可以把所有p標(biāo)簽替換為b標(biāo)簽，內(nèi)容不變：
$('p').each(function(){
$(this).replaceWith('<b>'+$(this).html()+'</b>');
});
結(jié)果
這就替換了！
多語(yǔ)言網(wǎng)站可以利用這個(gè)函數(shù)輕松完成
如果你開(kāi)發(fā)的是一個(gè)多語(yǔ)言的網(wǎng)站，甚至可以利用這個(gè)特性，比如，在你需要翻譯的文字上加上i標(biāo)簽，然后遍歷翻譯替換。
假如頁(yè)面dom結(jié)構(gòu)如下：
我們要把頁(yè)面中的i標(biāo)簽里的文本給翻譯，頁(yè)面中有i標(biāo)簽的分別是蘋(píng)果、電腦。于是我們實(shí)現(xiàn)需要一個(gè)翻譯庫(kù)：
var translate = {
'蘋(píng)果' : 'apple',
'電腦' : 'PC'
};
然后我可以這樣執(zhí)行翻譯替換
$('i').each(function(){
$(this).replaceWith(translate[$(this).html()]);
});
執(zhí)行后效果：
頁(yè)面效果：
相關(guān)文章
開(kāi)發(fā)插件的兩個(gè)方法jquery.fn.extend與jquery.extend
jQuery為開(kāi)發(fā)插件提拱了兩個(gè)方法，分別是jquery.fn.extend與jquery.extend，接下來(lái)就為大家介紹下兩者的具體使用2013-11-11
jQuery 頂部導(dǎo)航跟隨滾動(dòng)條滾動(dòng)固定浮動(dòng)在頂部
這篇文章主要介紹了通過(guò)jQuery實(shí)現(xiàn)的頂部導(dǎo)航跟隨滾動(dòng)條滾動(dòng)固定浮動(dòng)在頂部,需要的朋友可以參考下2014-06-06
JQuery Tips相關(guān)(1)----關(guān)于$.Ready()
學(xué)習(xí)jQuery的第一件事是：如果你想要一個(gè)事件運(yùn)行在你的頁(yè)面上，你必須在$(document).ready()里調(diào)用這個(gè)事件。所有包括在$(document).ready()里面的元素或事件都將會(huì)在DOM完成加載之后立即加載，并且在頁(yè)面內(nèi)容加載之前。2014-08-08
不知不覺(jué)10月都結(jié)束了，又要到年底了?？纯醋约荷洗螌?xiě)過(guò)的文章后，已經(jīng)2個(gè)月都沒(méi)寫(xiě)東西了2011-11-11
這篇文章主要介紹了jQuery實(shí)現(xiàn)不斷閃爍文字的方法,涉及jQuery中fadeOut、fadeIn方法及遞歸調(diào)用的技巧,需要的朋友可以參考下2015-05-05
jquery實(shí)現(xiàn)通用的內(nèi)容漸顯Tab選項(xiàng)卡效果
這篇文章主要介紹了jquery實(shí)現(xiàn)通用的內(nèi)容漸顯Tab選項(xiàng)卡效果,涉及jquery通過(guò)時(shí)間函數(shù)定時(shí)觸發(fā)頁(yè)面元素樣式變換的功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
通配符在控制input標(biāo)簽時(shí)相當(dāng)好用,這里簡(jiǎn)單進(jìn)行了jQuery中的通配符選擇器使用總結(jié),需要的朋友可以參考下2016-05-05
jquery結(jié)合html實(shí)現(xiàn)中英文頁(yè)面切換
這篇文章主要為大家詳細(xì)介紹了jquery結(jié)合html實(shí)現(xiàn)中英文頁(yè)面切換,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
JavaScript獲取onclick、onchange等事件值的代碼
這里主要是用到了getAttributeNode()這個(gè)方法，它獲取的是屬性節(jié)點(diǎn)，忽略屬性和事件的差別，具體示例如下，感興趣的朋友可以參考下哈希望對(duì)大家有所幫助2013-07-07
jQuery實(shí)現(xiàn)返回頂部功能適合不支持js的瀏覽器
a標(biāo)簽指向錨點(diǎn)top，可以在頂部防止一個(gè)a name=top的錨點(diǎn)，這樣在瀏覽器不支持js時(shí)也可以實(shí)現(xiàn)返回頂部的效果了2014-08-08