JavaScript ở đâu
Thẻ <script>
Trong HTML, mã JavaScript được chèn giữa các thẻ <script> và </script> .
Ví 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 loại: <script type="text/javascript">.
Thuộc tính loại không bắt buộc. JavaScript là ngôn ngữ kịch bản mặc định trong HTML.
Các hàm và sự kiện JavaScript
function JavaScript là một khối mã JavaScript, có thể được thực thi khi được "gọi".
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 nút.
Bạn sẽ tìm hiểu nhiều hơn về các chức năng 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 tập lệnh nào trong tài liệu HTML.
Tập lệnh có thể được đặt trong phần <body> hoặc trong phần <head> của trang HTML hoặc trong cả hai.
JavaScript trong <head>
Trong ví dụ này, một function JavaScript được đặt trong phần <head> của trang HTML.
Hàm được gọi (được gọi) khi nhấp vào nút:
Ví 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>
Hãy tự mình thử » JavaScript trong <body>
Trong ví dụ này, một function JavaScript được đặt trong phần <body> của trang HTML.
Hàm được gọi (được gọi) khi nhấp vào nút:
Ví 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>
Hãy tự mình thử »Việc đặt tập lệnh ở cuối phần tử <body> sẽ cải thiện tốc độ hiển thị vì việc giải thích tập lệnh sẽ làm chậm quá trình hiển thị.
JavaScript bên ngoài
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 rất hữu ích 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 .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 vào thuộc tính src (nguồn) của thẻ <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 thẻ <script> .
Tập lệnh bên ngoài không thể chứa thẻ <script> .
Ưu điểm của JavaScript bên ngoài
Việc đặt tập lệnh vào các tệp bên ngoài có một số lợi thế:
- Nó tách HTML và mã
- Nó làm cho HTML và JavaScript dễ đọc và 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:
Ví 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 đủ (địa chỉ web đầy đủ)
- Với đường dẫn tệp (như /js/)
- Không có con đường nào
Ví dụ này sử dụng URL đầy đủ để liên kết tới myScript.js:
Ví dụ này sử dụng đường dẫn tệp để liên kết đến myScript.js:
Ví dụ này không sử dụng đường dẫn để liên kết tới myScript.js:
Bạn có thể đọc thêm về đường dẫn tệp trong chương Đường dẫn tệp HTML .
