本篇文章為大家帶來了關於javascript的相關知識，其中詳細介紹了javaScript三種引入方式行內式，嵌入樣式、外部樣式及其使用方式；下面一起來看一下，希望對大家有幫助。
【相關推薦：javascript影片教學、web前端】
寫在行內，每個標籤裡面單獨設定
透過在開標籤中的事件屬性引用js的函數
(1)寫在標籤的事件屬性當中（以on開頭的屬性），如onclick【on 事件類型】
#推薦：html使用雙引號，js使用單引號
例：
<input>
註：行內引入，在JS中沒用提升權重的概念，所以其不常用[基本上不用]
範例如下：
<html>
<title>js样式内联写法</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<body>
<!--js内联写法01开始-->
<!--当鼠标点击图片时跳出弹窗显示1223-->
<div class="img">
单击事件：
<img src="images/001.jpg" onclick="alert(1223)" alt="JavaScript入門詳解三種引進方式" ></img>
</div>
<!--js内联写法01结束-->
</body>
</html>輸出結果：
寫在script標籤中
內部引用: 透過在script標籤中編寫js程式碼使用
script標籤可以寫在頁面任何位置
script標籤通常使用在body中的最後, 或body的後面
(1)可以寫在任意地方；
當需要我們在頭部引用腳本就放在頭部，否則則放在底部，因為放在頭部可能會影響瀏覽器渲染。
<script>
alert('Hello World!');
</script>註：一般在自己寫練習的時候，想偷懶不想設定js檔案時使用 [練習使用]
通常會自己做專案的時候放在底部，不影響載入順序又可以和CSS檔案區分，並且不會影響瀏覽器渲染；若放在其他處最好用onload套起來用
#範例如下：
<html>
<title>js样式内联写法</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<body>
<!--js内联写法02开始-->
<div class="img">
单击事件：
<img src="images/002.jpg" id='yuansu' alt="JavaScript入門詳解三種引進方式" ></img>
</div>
<!--js内联写法02结束-->
</body>
<script>
//js代码
//找到XX元素，一般给元素加id
yuansuojb=document.getElementById('yuansu');
//给xx元素加事件
yuansuojb.onclick=function(){
//代码段
alert(1);
}
//触发事件
</script>
</html>輸出結果：
<script src="main.js"></script>
常用]
使用的是src不是href##範例如下：
將js的程式碼寫到.js的檔案中，並在HTML中引用
.html檔案內容如下：
<html>
<title>js样式外联写法</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<body>
<div class="img">
外联写法--单击事件：
<img src="images/003.jpg" id='yuansu' alt="JavaScript入門詳解三種引進方式" ></img>
</div>
</body>
<script src='js/index.js'></script>
</html>.js檔案內容如下：
//js代码
//找到XX元素，一般给元素加id
yuansuojb=document.getElementById('yuansu');
//给xx元素加事件
yuansuojb.onclick=function(){
//代码段
var str="hello world !!!";
alert(str);
}輸出結果：
【相關推薦：
、web前端】
以上是JavaScript入門詳解三種引進方式的詳細內容。更多資訊請關注PHP中文網其他相關文章！
