Javascript where to

15/06/2019

Bài sau » « Bài trước

The <script> Tag

Trong HTML, Javascript phải nằm trong cặp thẻ <script></script>.

<script> document.getElementById("demo").innerHTML = "My First JavaScript"; </script>

Chú ý: Nhiều lúc bạn sẽ gặp khai báo javascript như sau: <script type="text/javascript">. Nhưng thuộc tính type này không bắt buộc. Bởi vì, JavaScript là ngôn ngữ kịch bản mặc định trong HTML.

JavaScript Functions and Events

Javascript function là một khối code javascript, nó sẽ thực thi khi được gọi - call.

Ví dụ, Một function có thể được gọi khi có 1 event xảy ra: khi user click chuột vào button.

Chúng ta sẽ tìm hiểu kỹ hơn phần này ở các bài học sau.

JavaScript in <head>

Javascript có thể đặt trong thẻ <head> và không giới hạn số lượng thẻ script.

Ví dụ bên dưới javascript đặt trong thẻ <head> và function được gọi khi click vào button.

<!DOCTYPE html> <html> <head> <script> function myFunction() { document.getElementById("demo").innerHTML = "Đoạn văn bản thay bởi click vào button."; } </script> </head> <body> <h2>Javascript where to - in head</h2> <p id="demo">Đoạn văn bản mặc định.</p> <button type="button" onclick="myFunction()">Click vào đi!</button> </body> </html>

Javascript where to - in head

Đoạn văn bản mặc định.

JavaScript in <body>

Javascript có thể đặt trong thẻ <body> và không giới hạn số lượng thẻ script.

Ví dụ bên dưới javascript đặt trong thẻ <body> và function được gọi khi click vào button.

<!DOCTYPE html> <html> <head> </head> <body> <script> function myFunction2() { document.getElementById("demo2").innerHTML = "Đoạn văn bản thay bởi click vào button."; } </script> <h2>Javascript where to - in body</h2> <p id="demo2">Đoạn văn bản mặc định.</p> <button type="button" onclick="myFunction2()">Click vào đi!</button> </body> </html>

Javascript where to - in body

Đoạn văn bản mặc định.

Chú ý: Nên đặt các thẻ script ở cuối thẻ body - trước thẻ đóng </body>, vì như thế sẽ cải thiện tốc độ load website cũng như tốc độ hiển thị.

External JavaScript

Script có thể được đặt trong file từ bên ngoài. Ví dụ, file myscript.js ta có đoạn code như sau:

function myFunction() { document.getElementById("demo").innerHTML = "Đoạn văn bản thay thế."; }

External JavaScript có thể được sử dụng cho nhiều trang khác nhau.

JavaScript file có phần đuôi mở rộng là .js

Để sử dụng file External JavaScript ta khai báo đường dẫn trỏ tới file js trong thuộc tính src.

<script src="myscript.js"></script>

Bạn có thể đặt External JavaScript trong thẻ <head> hoặc <body>. Đoạn script sẽ hoạt động như thể nó được đặt chính xác nơi đặt thẻ <script>.

Chú ý: External scripts không được chứa thẻ <script>.

Lợi thế khi đặt file Javascript bên ngoài

  • Rạch ròi giữa HTML and code
  • Nó làm HTML và JavaScript dễ dàng để đọc và bảo trì.
  • Các tệp JavaScript được lưu trong bộ nhớ cache có thể tăng tốc độ tải trang

Để chèn nhiều external script vào website thì ta khai báo nhiều thẻ  <script>

<script src="myscript.js"></script> <script src="myscript2.js"></script>

Bài sau » « Bài trước
Back to top