網(wǎng)站繁簡(jiǎn)切換的JS遇到頁(yè)面卡死的解決方法
更新時(shí)間：2014年03月12日 15:46:40 投稿：whsnow
最近開(kāi)發(fā)了繁體版本的網(wǎng)站，在網(wǎng)上找了一段比較流行的繁簡(jiǎn)切換的JS實(shí)現(xiàn)了，不過(guò)后來(lái)卻發(fā)現(xiàn)，有些頁(yè)面會(huì)卡死，針對(duì)這個(gè)問(wèn)題，下面有個(gè)不錯(cuò)的解決方法
公司打算開(kāi)發(fā)繁體版本的網(wǎng)站，數(shù)據(jù)庫(kù)里的信息全是簡(jiǎn)體，除了網(wǎng)頁(yè)上固定的文字手動(dòng)翻譯了，文章內(nèi)容標(biāo)題都不是繁體。
于是在網(wǎng)上找了一段比較流行的繁簡(jiǎn)切換的JS實(shí)現(xiàn)了，不過(guò)后來(lái)卻發(fā)現(xiàn)，有些頁(yè)面會(huì)卡死，根本無(wú)法執(zhí)行下去。彈出信息表明都是這個(gè)繁簡(jiǎn)切換的JS帶來(lái)的問(wèn)題。
仔細(xì)查看了下，發(fā)現(xiàn)原來(lái)是這個(gè)問(wèn)題。分享下，也許有不少人遇到類(lèi)似的問(wèn)題。
先上代碼：
復(fù)制代碼 代碼如下:
//模仿語(yǔ)言包式的簡(jiǎn)繁轉(zhuǎn)換功能插件！
var Default_isFT = 0 //默認(rèn)是否繁體，0-簡(jiǎn)體，1-繁體
var StranIt_Delay = 50 //翻譯延時(shí)毫秒（設(shè)這個(gè)的目的是讓網(wǎng)頁(yè)先流暢的顯現(xiàn)出來(lái)）
//－－－－－－－代碼開(kāi)始，以下別改－－－－－－－
//轉(zhuǎn)換文本
function StranText(txt,toFT,chgTxt)
{
if(txt==""||txt==null)return ""
toFT=toFT==null?BodyIsFt:toFT
if(chgTxt)txt=txt.replace((toFT?"簡(jiǎn)":"繁"),(toFT?"繁":"簡(jiǎn)"))
if(toFT){return Traditionalized(txt)}
else {return Simplized(txt)}
}
//轉(zhuǎn)換對(duì)象，使用遞歸，逐層剝到文本
function StranBody(fobj)
{
if(typeof(fobj)=="object"){var obj=fobj.childNodes}
else
{
var tmptxt=StranLink_Obj.innerHTML.toString()
if(tmptxt.indexOf("簡(jiǎn)")<0)
{
BodyIsFt=1
StranLink_Obj.innerHTML=StranText(tmptxt,0,1)
//StranLink.title=StranText(StranLink.title,0,1)
}
else
{
BodyIsFt=0
StranLink_Obj.innerHTML=StranText(tmptxt,1,1)
//StranLink.title=StranText(StranLink.title,1,1)
}
setCookie(JF_cn,BodyIsFt,7)
var obj=document.body.childNodes
}
for(var i=0;i<obj.length;i++)
{
var OO=obj.item(i)
if("||BR|HR|TEXTAREA|".indexOf("|"+OO.tagName+"|")>0||OO==StranLink_Obj)continue;
if(OO.title!=""&&OO.title!=null)OO.title=StranText(OO.title);
if(OO.alt!=""&&OO.alt!=null)OO.alt=StranText(OO.alt);
if(OO.tagName=="INPUT"&&OO.value!=""&&OO.type!="text"&&OO.type!="hidden")OO.value=StranText(OO.value);
if(OO.nodeType==3){OO.data=StranText(OO.data)}
else StranBody(OO)
}
}
function Traditionalized(cc){
var str='',ss=JTPYStr(),tt=FTPYStr();
var ssa = JTPYWord(),tta = FTPYWord();
for(var i=0;i<cc.length;i++)
{
if(cc.charCodeAt(i)>10000&&ss.indexOf(cc.charAt(i))!=-1)str+=tt.charAt(ss.indexOf(cc.charAt(i)));
else str+=cc.charAt(i);
}
for(var j=0;j<ssa.length;j++){
if(str.indexOf(ssa[j]) >= 0){
str = str.replace(ssa[j],tta[j]);
}else{
str = str;
}
}
return str;
}
function Simplized(cc){
var str='',ss=JTPYStr(),tt=FTPYStr();
var ssa = JTPYWord(),tta = FTPYWord();
for(var i=0;i<cc.length;i++)
{
if(cc.charCodeAt(i)>10000&&tt.indexOf(cc.charAt(i))!=-1)str+=ss.charAt(tt.indexOf(cc.charAt(i)));
else str+=cc.charAt(i);
}
for(var j=0;j<ssa.length;j++){
if(str.indexOf(tta[j]) >= 0){
str = str.replace(tta[j],ssa[j]);
}else{
str = str;
}
}
return str;
}
function setCookie(name, value) //cookies設(shè)置
{
var argv = setCookie.arguments;
var argc = setCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
if(expires!=null)
{
var LargeExpDate = new Date ();
LargeExpDate.setTime(LargeExpDate.getTime() + (expires*1000*3600*24));
}
document.cookie = name + "=" + escape (value)+((expires == null) ? "" : ("; expires=" +LargeExpDate.toGMTString()));
}
function getCookie(Name) //cookies讀取
{
var search = Name + "="
if(document.cookie.length > 0)
{
offset = document.cookie.indexOf(search)
if(offset != -1)
{
offset += search.length
end = document.cookie.indexOf(";", offset)
if(end == -1) end = document.cookie.length
return unescape(document.cookie.substring(offset, end))
}
else return ""
}
}
var StranLink_Obj=document.getElementById("StranLink")
if (StranLink_Obj)
{
var JF_cn="ft"+self.location.hostname.toString().replace(/\./g,"")
var BodyIsFt=getCookie(JF_cn)
if(BodyIsFt!="1")BodyIsFt=Default_isFT
with(StranLink_Obj)
{
if(typeof(document.all)!="object") //非IE瀏覽器
{
href="javascript:StranBody()"
}
else
{
href="#";
onclick= new Function("StranBody();return false")
}
title=StranText("點(diǎn)擊以繁體中文方式瀏覽",1,1);
innerHTML=StranText(innerHTML,1,1);
}
if(BodyIsFt=="1"){setTimeout("StranBody()",StranIt_Delay)}
}
起初我以為是那個(gè)遞歸的問(wèn)題引起的，但是測(cè)試發(fā)現(xiàn)就算是很多字符，它仍然能快速的進(jìn)行替換。
經(jīng)過(guò)排查，原來(lái)是JS和OBJECT標(biāo)簽會(huì)帶來(lái)卡死的問(wèn)題。繁簡(jiǎn)切換實(shí)現(xiàn)必然會(huì)跳過(guò)某些標(biāo)簽，看到這段，它的作用就是來(lái)判斷替換哪些標(biāo)簽里的文字。
復(fù)制代碼 代碼如下:
for(var i=0;i<obj.length;i++)
{
var OO=obj.item(i)
if("||BR|HR|TEXTAREA|".indexOf("|"+OO.tagName+"|")>0||OO==StranLink_Obj)continue;
if(OO.title!=""&&OO.title!=null)OO.title=StranText(OO.title);
if(OO.alt!=""&&OO.alt!=null)OO.alt=StranText(OO.alt);
if(OO.tagName=="INPUT"&&OO.value!=""&&OO.type!="text"&&OO.type!="hidden")OO.value=StranText(OO.value);
if(OO.nodeType==3){OO.data=StranText(OO.data)}
else StranBody(OO)
}
加上這個(gè)就一切正常了：
復(fù)制代碼 代碼如下:
if(OO.tagName=="OBJECT")continue;
if(OO.tagName=="SCRIPT")continue;
相關(guān)文章
微信小程序簡(jiǎn)潔登錄頁(yè)面的實(shí)現(xiàn)(附源碼)
本文主要介紹了微信小程序簡(jiǎn)潔登錄頁(yè)面的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-12-12
使用bootstrapValidator插件進(jìn)行動(dòng)態(tài)添加表單元素并校驗(yàn)
動(dòng)態(tài)添加表單元素，并調(diào)用bootstrapValidator的方法為表單添加校驗(yàn)規(guī)則，調(diào)用addField()方法實(shí)現(xiàn)功能。下面通過(guò)本文看下具體實(shí)現(xiàn)方法吧2016-09-09
JavaScript HTML DOM 元素 (節(jié)點(diǎn))新增，編輯，刪除操作實(shí)例分析
這篇文章主要介紹了JavaScript HTML DOM 元素 (節(jié)點(diǎn))新增，編輯，刪除操作,結(jié)合實(shí)例形式分析了JavaScript針對(duì)HTML DOM 元素 (節(jié)點(diǎn))的新增，編輯，刪除相關(guān)操作技巧與使用注意事項(xiàng),需要的朋友可以參考下2020-03-03
JavaScript中利用Array和Object實(shí)現(xiàn)Map的方法
這篇文章主要介紹了JavaScript中利用Array和Object實(shí)現(xiàn)Map的方法,實(shí)例分析了javascript實(shí)現(xiàn)map的添加、獲取、移除、清空、遍歷等操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07
這篇文章主要介紹了js如何操作iframe父子窗體,需要的朋友可以參考下2014-05-05
JavaScript實(shí)現(xiàn)維吉尼亞(Vigenere)密碼算法實(shí)例
Vigenere密碼就是一種傳統(tǒng)加密技術(shù)，它是多表代換密碼，能夠有效改進(jìn)單表代換密碼的詞頻分布特征問(wèn)題,本文用JavaScript實(shí)現(xiàn)維吉尼亞(Vigenere)密碼算法2013-11-11
用Webpack構(gòu)建Vue項(xiàng)目的實(shí)踐
這篇文章主要介紹了用Webpack構(gòu)建Vue項(xiàng)目的實(shí)踐，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-11-11
利用純JavaScript實(shí)現(xiàn)讀取和導(dǎo)出Excel文件
在 Web 開(kāi)發(fā)中,導(dǎo)入和導(dǎo)出 Excel 文件是一個(gè)常見(jiàn)的需求,特別是對(duì)于數(shù)據(jù)報(bào)表和分析等場(chǎng)景,雖然有很多第三方庫(kù)（如 xlsx 和 sheetjs）提供了非常強(qiáng)大的功能,但本文將探討如何不依賴(lài)第三方庫(kù),利用純 JavaScript 來(lái)實(shí)現(xiàn)讀取和導(dǎo)出Excel文件,需要的朋友可以參考下2025-03-03
JavaScript學(xué)習(xí)小結(jié)之使用canvas畫(huà)“哆啦A夢(mèng)”時(shí)鐘
這篇文章主要介紹了JavaScript學(xué)習(xí)小結(jié)之使用canvas畫(huà)“哆啦A夢(mèng)”時(shí)鐘的相關(guān)資料,需要的朋友可以參考下2016-07-07
這篇文章主要為大家詳細(xì)介紹了GOJS+VUE實(shí)現(xiàn)流程圖效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-12-12