JS程式碼在Html中的位置分佈與呼叫
阿新 • • 發佈：2018-12-24
JS由EcmaScript、Dom、Bom組成
EcmaScript:語法和基本物件、Dom：文件物件模型，描述處理網頁內容的方法和介面
Bom：Browser
出現位置：
//JS出現在行間
<input type="button" id="btn" value="按鈕" style="background:#f00" onclick="alert(1)"/>//JS內嵌 <head> <style> #btn{background:#f00;} </style> </head> <body> <input type="button" id="btn" value="按鈕"/> <script> document.getElementById("btn").onclick=function(){ alert(1);} </script> </body>
//JS外鏈
//style1.js檔案
document.getElementById("btn").onclick=function(){
alert(1);}
//呼叫style1.js檔案
<body>
<input type="button" id="btn" value="按鈕"/>
<script src="style1.js"></script>
</body>舉個具體的例子說明下：
要求：1.點選頁面按鈕，按鈕背景變成黃色 2.點選頁面按鈕，改變div的寬度和高度
也就是執行兩個JS事件
<script> window.onload=function(){ document.getElementById("btn").onclick=function(){ document.getElementById("btn").style.background="yellow"; document.getElementById("box").style.width="200px"; document.getElementById("box").style.height="200px"; } } </script>