                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /JavaScript入門篇

javasript改變HTML樣式放在head標(biāo)簽實現(xiàn)不了的問題

應(yīng)該是跟文檔是從由上到下讀取的問題那么為什么放在head標(biāo)簽的時候樣式不能實現(xiàn)而隱藏顯示按鈕卻可以實現(xiàn)呢

瘋子亞當(dāng)

2016-05-08

源自：JavaScript入門篇 3-5

關(guān)注問題我要回答

1136

操作

收起

1 回答

Alrene_ 回答被采納 +3 積分
2016-05-08

1、主要是先加載和后加載的區(qū)別。

如果JavaScript腳本寫在head標(biāo)簽里面，那么需要用window.onload起到一個延遲加載的作用。

2、實例：你要寫在head里實現(xiàn)可以這樣寫。舉個例子：

a:不能實現(xiàn)

<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/>
<title>style樣式</title>
?<script?type="text/javascript">
????var?mychar=?document.getElementById("con");
????mychar.style.color="red";
????mychar.style.backgroundColor="blue";
????mychar.style.width="150px";
??</script>
</head>
<body>
??<h2?id="con">I?love?JavaScript</H2>
??<p>?JavaScript使網(wǎng)頁顯示動態(tài)效果并實現(xiàn)與用戶交互功能。</p>
</body>
</html>

b：實現(xiàn)了

<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/>
<title>style樣式</title>
?<script?type="text/javascript">
?function?a(){
????var?mychar=?document.getElementById("con");
????mychar.style.color="red";
????mychar.style.backgroundColor="blue";
????mychar.style.width="150px";
}
??</script>
</head>
<body?onload=a()>
??<h2?id="con">I?love?JavaScript</H2>
??<p>?JavaScript使網(wǎng)頁顯示動態(tài)效果并實現(xiàn)與用戶交互功能。</p>
</body>
</html>