JavaScript ở đâu
Thẻ <script>
Trong HTML, mã JavaScript được chèn vào giữa các thẻ <script>và .</script>
Thí dụ
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
Các ví dụ JavaScript cũ có thể sử dụng thuộc tính type: <script type = "text / javascript">.
Thuộc tính type không bắt buộc. JavaScript là ngôn ngữ kịch bản mặc định trong HTML.
Các chức năng và sự kiện JavaScript
JavaScript functionlà một khối mã JavaScript, có thể được thực thi khi được "gọi" cho.
Ví dụ: một hàm có thể được gọi khi một sự kiện xảy ra, như khi người dùng nhấp vào một nút.
Bạn sẽ tìm hiểu thêm về các hàm và sự kiện trong các chương sau.
JavaScript trong <head> hoặc <body>
Bạn có thể đặt bất kỳ số lượng script nào trong một tài liệu HTML.
Tập lệnh có thể được đặt trong <body>hoặc trong <head>phần của trang HTML hoặc trong cả hai.
JavaScript trong <head>
Trong ví dụ này, JavaScript functionđược đặt trong <head>phần của trang HTML.
Hàm được gọi (được gọi) khi một nút được nhấp vào:
Thí dụ
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>
<h2>Demo JavaScript in Head</h2>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
</body>
</html>
JavaScript trong <body>
Trong ví dụ này, JavaScript functionđược đặt trong <body>phần của trang HTML.
Hàm được gọi (được gọi) khi một nút được nhấp vào:
Thí dụ
<!DOCTYPE html>
<html>
<body>
<h2>Demo JavaScript in Body</h2>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</body>
</html>
Việc đặt các tập lệnh ở cuối phần tử <body> sẽ cải thiện tốc độ hiển thị, vì việc diễn giải tập lệnh làm chậm hiển thị.
JavaScript bên ngoài
Các tập lệnh cũng có thể được đặt trong các tệp bên ngoài:
Tệp bên ngoài: myScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
Các tập lệnh bên ngoài là thực tế khi cùng một mã được sử dụng trong nhiều trang web khác nhau.
Các tệp JavaScript có phần mở rộng tệp là .js .
Để sử dụng tập lệnh bên ngoài, hãy đặt tên của tệp tập lệnh trong thuộc tính src(nguồn) của <script>thẻ:
Thí dụ
<script src="myScript.js"></script>
Bạn có thể đặt tham chiếu tập lệnh bên ngoài vào <head>hoặc <body>tùy thích.
Tập lệnh sẽ hoạt động như thể nó được đặt chính xác ở vị trí của <script>thẻ.
Tập lệnh bên ngoài không được chứa <script>thẻ.
Ưu điểm của JavaScript bên ngoài
Đặt tập lệnh trong các tệp bên ngoài có một số lợi thế:
- Nó phân tách HTML và mã
- Nó làm cho HTML và JavaScript dễ đọc và dễ bảo trì hơn
- Các tệp JavaScript được lưu trong bộ nhớ cache có thể tăng tốc độ tải trang
Để thêm một số tệp tập lệnh vào một trang - hãy sử dụng một số thẻ tập lệnh:
Thí dụ
<script src="myScript1.js"></script>
<script src="myScript2.js"></script>
Tài liệu tham khảo bên ngoài
Một tập lệnh bên ngoài có thể được tham chiếu theo 3 cách khác nhau:
- Với một URL đầy đủ (một địa chỉ web đầy đủ)
- Với một đường dẫn tệp (như / js /)
- Không có bất kỳ con đường nào
Ví dụ này sử dụng một URL đầy đủ để liên kết đến myScript.js:
Thí dụ
<script src="https://www.w3schools.com/js/myScript.js"></script>
Ví dụ này sử dụng đường dẫn tệp để liên kết đến myScript.js:
Thí dụ
<script src="/js/myScript.js"></script>
Ví dụ này không sử dụng đường dẫn nào để liên kết đến myScript.js:
Thí dụ
<script src="myScript.js"></script>
Bạn có thể đọc thêm về đường dẫn tệp trong chương Đường dẫn tệp HTML .