Hướng dẫn html with javascript - html với javascript

- Để sử dụng JavaScript trong trang web, chúng ta có hai cách cơ bản như sau:

  • Cách 1: Viết mã lệnh JavaScript trực tiếp vào trang web.
  • Cách 2: Viết mã lệnh JavaScript vào tập tin JavaScript (tập tin có phần đuôi là .js)

1) Viết mã lệnh trực tiếp vào trang web

- Mã lệnh JavaScript có thể được viết trực tiếp vào trang web thông qua cặp thẻ .

Trang web dưới đây sử dụng một đoạn , trong đoạn có ba câu lệnh





    Lập Trình Web


    

Tài liệu học HTML

Tài liệu học JavaScript

Xem ví dụ

- Các đoạn có thể được đặt ở bất kỳ nơi nào trong trang web. Tuy nhiên nên đặt chúng ở vị trí cuối cùng trong phần tử giống ví dụ phía trên. Điều đó giúp cải thiện tốc độ tải giao diện của trang web và tránh một số trường hợp xảy ra lỗi thực thi ngoài mong đợi.

- Bạn sẽ được tìm hiểu kỹ về vấn đề này ở bài Nguyên lý thực thi mã lệnh trong JavaScript.

- Trong một trang web có thể sử dụng nhiều đoạn và trong một đoạn thì không giới hạn số lượng câu lệnh.





    Lập Trình Web


    

Tài liệu học HTML

Tài liệu học JavaScript

Xem ví dụ

- Các đoạn có thể được đặt ở bất kỳ nơi nào trong trang web. Tuy nhiên nên đặt chúng ở vị trí cuối cùng trong phần tử giống ví dụ phía trên. Điều đó giúp cải thiện tốc độ tải giao diện của trang web và tránh một số trường hợp xảy ra lỗi thực thi ngoài mong đợi.

- Bạn sẽ được tìm hiểu kỹ về vấn đề này ở bài Nguyên lý thực thi mã lệnh trong JavaScript.

- Trong một trang web có thể sử dụng nhiều đoạn và trong một đoạn thì không giới hạn số lượng câu lệnh.

- Bên trong đoạn chỉ dùng để chứa các mã lệnh JavaScript và tuyệt đối không được đặt vào đó những đoạn khác.

2) Viết mã lệnh vào tập tin JavaScript

- Việc viết mã lệnh JavaScript trực tiếp vào trang web (giống như cách 1) sẽ khiến mã nguồn của trang web bị "rối nùi", làm cho người lập trình viên khó quan sát, quản lý cũng như cập nhật nâng cấp mã nguồn (Điều này là dễ hiểu, bạn cứ thử nghĩ một trang web có khoảng vài trăm dòng lệnh HTML/CSS đã khó quan sát như thế nào rồi, mà còn nhét thêm cả JavaScript vào đó nữa thì sẽ ra sao !?)

Hướng dẫn html with javascript - html với javascript

- Để khắc phục vấn đề trên, ta còn một cách sử dụng JavaScript khác chính là viết mã lệnh vào bên trong tập tin JavaScript, sau đó nhúng tập tin JavaScript vào trang web.

  • 2.1) Cách tạo tập tin JavaScript
  • - Bước 1: Mở Notepad lên.
  • - Bước 2: Lưu tập tin..js
    (Ở hướng dẫn này, tôi tạo tập tin JavaScript có tên là myscript)
  • Bấm vào "File" rồi chọn "Save As"
  • Chọn thư mục để lưu tập tin

Hướng dẫn html with javascript - html với javascript

Tên tập tin phải có phần mở rộng là .js(Ở hướng dẫn này, tôi tạo tập tin JavaScript có tên là myscript)

Chỗ Encoding chọn "UTF-8"

Cuối cùng, bấm nút "Save" để lưu tập tin

document.getElementById("demo1").innerHTML = "Tài liệu học CSS";
document.getElementById("demo2").innerHTML = "Tài liệu học MySQL";
document.getElementById("demo3").innerHTML = "Tài liệu học PHP";

2.2) Cách viết mã lệnh trong tập tin JavaScript

- Cách viết mã lệnh trong tập tin JavaScript cũng giống như cách viết mã lệnh trực tiếp vào trang web. Điểm khác nhau là khi viết mã lệnh trong tập tin JavaScript thì ta không cần đặt các câu lệnh bên trong cặp thẻ .

- Ví dụ, cách viết mã lệnh trong tập tin myscript.js dưới đây là ĐÚNG.

- Ví dụ, cách viết mã lệnh trong tập tin myscript.js dưới đây là SAI.





    Lập Trình Web


    

Tài liệu học HTML

Tài liệu học JavaScript

Xem ví dụ

- Các đoạn có thể được đặt ở bất kỳ nơi nào trong trang web. Tuy nhiên nên đặt chúng ở vị trí cuối cùng trong phần tử giống ví dụ phía trên. Điều đó giúp cải thiện tốc độ tải giao diện của trang web và tránh một số trường hợp xảy ra lỗi thực thi ngoài mong đợi.

- Bạn sẽ được tìm hiểu kỹ về vấn đề này ở bài Nguyên lý thực thi mã lệnh trong JavaScript.

- Trong một trang web có thể sử dụng nhiều đoạn và trong một đoạn thì không giới hạn số lượng câu lệnh.





    Lập Trình Web


    

Tài liệu học HTML

Tài liệu học JavaScript

Xem ví dụ

- Các đoạn có thể được đặt ở bất kỳ nơi nào trong trang web. Tuy nhiên nên đặt chúng ở vị trí cuối cùng trong phần tử giống ví dụ phía trên. Điều đó giúp cải thiện tốc độ tải giao diện của trang web và tránh một số trường hợp xảy ra lỗi thực thi ngoài mong đợi.

- Bạn sẽ được tìm hiểu kỹ về vấn đề này ở bài Nguyên lý thực thi mã lệnh trong JavaScript.

- Trong một trang web có thể sử dụng nhiều đoạn và trong một đoạn thì không giới hạn số lượng câu lệnh.