การใช้ JavaScript
- หน้าก่อนหน้า เรียนรู้ JS
- หน้าต่อไป ออกเสียง JS
<script> แท็ก
ใน HTML รหัส JavaScript ต้องตั้งอยู่ <script>
กับ </script>
ระหว่างโทร์โดยรวม
ตัวอย่าง
<script> document.getElementById("demo").innerHTML = "มีรายละเอียดแรกของ JavaScript"; </script>
注释:旧的 JavaScript 例子也许会使用 type
属性:<script type="text/javascript">。
注释:type 属性不是必需的。JavaScript 是 HTML 中的默认脚本语言。
JavaScript 函数和事件
JavaScript 函数是一种 JavaScript 代码块,它可以在调用时被执行。
例如,当发生事件时调用函数,比如当用户点击按钮时。
提示:您将在稍后的章节学到更多有关函数和事件的知识。
<head> 或 <body> 中的 JavaScript
您能够在 HTML 文档中放置任意数量的脚本。
脚本可被放置与 HTML 页面的 <body>
或 <head>
部分中,或兼而有之。
<head> 中的 JavaScript
在本例中,JavaScript 函数被放置于 HTML 页面的 <head>
部分。
该函数会在按钮被点击时调用:
ตัวอย่าง
<!DOCTYPE html> <html> <head> <script> function myFunction() { document.getElementById("demo").innerHTML = "段落被更改。"; } </script> </head> <body> <h1>一张网页</h1> <p id="demo">一个段落</p> <button type="button" onclick="myFunction()">试一试</button> </body> </html>
<body> 中的 JavaScript
在本例中,JavaScript 函数被放置于 HTML 页面的 <body>
部分。
该函数会在按钮被点击时调用:
ตัวอย่าง
<!DOCTYPE html> <html> <body> <h1>A Web Page</h1> <p id="demo">一个段落</p> <button type="button" onclick="myFunction()">试一试</button> <script> function myFunction() { document.getElementById("demo").innerHTML = "段落被更改。"; } </script> </body> </html>
提示:把脚本置于 <body>
元素的底部,可改善显示速度,因为脚本编译会拖慢显示。
外部脚本
脚本可放置与外部文件中:
外部文件:myScript.js
function myFunction() { document.getElementById("demo").innerHTML = "段落被更改。"; }
外部脚本很实用,如果相同的脚本被用于许多不同的网页。
JavaScript 文件的文件扩展名是 .js。
如需使用外部脚本,请在 <script>
标签的 src
(source) 属性中设置脚本的名称:
ตัวอย่าง
<script src="myScript.js"></script>
您可以在 <head>
或 <body>
中放置外部脚本引用。
该脚本的表现与它被置于 <script>
标签中是一样的。
注释:外部脚本不能包含 <script>
ตาที่
ข้อเสี่ยงของ JavaScript ภายนอก
ตัวเลือกที่มีของการจัดเก็บสคริปต์ในไฟล์นอก
- แยก HTML และรหัส
- ทำให้ HTML และ JavaScript ง่ายต่อการอ่านและบำรุงรักษา
- ไฟล์ JavaScript ที่หลักฐานได้จะเร่งการโหลดหน้าเว็บ
ถ้าคุณต้องการเพิ่มสคริปต์หลายไฟล์ในหน้าเดียว - ใช้แบตทิก script หลายแบตทิก
ตัวอย่าง
<script src="myScript1.js"></script> <script src="myScript2.js"></script>
อ้างอิงภายนอก
สามารถอ้างอิงสคริปต์ภายนอกด้วย URL ที่สมบูรณ์ หรือเส้นทางเรlativeto ต่อหน้าเว็บปัจจุบัน
ตัวอย่างนี้ใช้ URL ที่สมบูรณ์เพื่อลิงไปยังสคริปต์
ตัวอย่าง
<script src="https://www.codew3c.com/js/myScript1.js"></script>
ตัวอย่างนี้ใช้สคริปต์ที่ตั้งอยู่ในโซนเกี่ยวข้องของเว็บไซต์ปัจจุบัน
ตัวอย่าง
<script src="/js/myScript1.js"></script>
ตัวอย่างนี้เชื่อมโยงไปยังสคริปต์ในไฟล์เดอะรอยัลที่เดียวกับเว็บปลายทางปัจจุบัน
ตัวอย่าง
<script src="myScript1.js"></script>
คุณสามารถ หนทางเข้า HTMLเรียนรู้เกี่ยวกับหนทางเข้าแบบไฟล์
- หน้าก่อนหน้า เรียนรู้ JS
- หน้าต่อไป ออกเสียง JS