定義 script 標簽,在 script 標簽中,通過src屬性導入外部js文件,並且加載執行外部js文件中國的程序代碼內容
因為代碼執行順序問題,一般定義 script 標簽 在 body標簽內容的最下方
如果 script 標簽帶有 src 屬性,那么就只會執行 外部式 寫在 script 標簽內容中的 內部式 不會被執行,是無效代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="./demo.js"></script>
<style>
.div1{ color : red ; }
</style>
</head>
<body>
<div class="div1">北京</div>
</body>
</html>
下面是demo.js里面的代碼
window.alert('我是外部程序');
const oDiv = document.querySelector('div');
oDiv.onclick = function(){
this.innerHTML = '實在是熱啊,能不能有人幫我拿個冰鎮飲料';
this.style.color = 'pink';
}
這里是演示無效代碼
<div>北京</div>
<!-- 帶有 scr 屬性的script 標簽,只會執行外部式
內容中的 JavaScript 代碼是無效的
-->
<script src="">
// 無效代碼
const oDiv = document.querySelector('div');
oDiv.onclick = function(){
this.style.color = 'red';
this.style.fontSize = '100px';
this.style.background = 'orange';
}
</script>