<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8">
<title>無標(biāo)題文檔</title>
</head>
<body>
??<div><b?id="oldnode">JavaScript</b>是一個(gè)很常用的技術(shù),為網(wǎng)頁添加動(dòng)態(tài)效果。</div>
??<a?href="javascript:replaceMessage()">?加粗與斜體之間變換</a>
??
????<script?type="text/javascript">
?????var?nu=0;//用于判定
?????var?New=document.createElement("i");//創(chuàng)建節(jié)點(diǎn)1,默認(rèn)為斜體,用于切換。
?????var?Old=document.createElement("b");//創(chuàng)建節(jié)點(diǎn)2,節(jié)點(diǎn)與原文相同,用于復(fù)原。
?????var?O=document.getElementById("oldnode");
?????New.innerHTML=O.innerHTML;//新節(jié)點(diǎn)文本內(nèi)容與原文相同。
?????Old.innerHTML=O.innerHTML;//新節(jié)點(diǎn)文本內(nèi)同與原文相同。
?????function?replaceMessage(){
?????????if(nu===0){
?????????????O.parentNode.replaceChild(New,O)//節(jié)點(diǎn)1切節(jié)點(diǎn)2
?????????????
?????????}
?????????if(nu===1){
?????????????New.parentNode.replaceChild(Old,New)//節(jié)點(diǎn)2切節(jié)點(diǎn)1
?????????????nu=nu-2;
?????????}
?????????nu++
??????????
?????}
???????
??</script>
??
?</body>
</html>我發(fā)現(xiàn)可以切換也可以實(shí)現(xiàn)一次樣式復(fù)原,但僅一次而已,請(qǐng)各位指點(diǎn)!
javascript怎么通過replaceChild()的方法來實(shí)現(xiàn)樣式的自由轉(zhuǎn)換了?
我要沖錢
2016-12-26 23:37:18