🔥CHỌN LỌC TOP NHỮNG KHOÁ HỌC LẬP TRÌNH ONLINE NHIỀU NGƯỜI THEO HOC TẠI ĐÂY🔥

Phần này của hướng dẫn sẽ nói về tính những cái cốt lõi của JavaScript.

Nhưng chúng ta cần một môi trường làm việc để chạy các tập lệnh của chúng ta và trình duyệt là một lựa chọn tốt. Chúng ta sẽ hạn chế sử dụng các lệnh cụ thể của trình duyệt (như alert) ở mức tối thiểu để bạn không dành thời gian cho chúng nếu bạn dự định tập trung vào một môi trường khác (như Node.js). Chúng ta sẽ tập trung vào JavaScript trong trình duyệt từ các phần tiếp theo, Ở phần này chúng ta chỉ tập trung vào học Ngôn ngữ Javascript.

Vì vậy, trước tiên, hãy xem cách chúng ta đính kèm tập lệnh vào trang web. Đối với môi trường phía máy chủ (như Node.js), bạn có thể thực thi tập lệnh bằng lệnh như thế nào "node my.js".

1. Tập lệnh Script

Các chương trình JavaScript có thể được chèn vào bất kỳ phần nào của tài liệu HTML với sự trợ giúp của thẻ <script>.

Ví dụ:

/*
Cafedev.vn - Kênh thông tin IT hàng đầu Việt Nam
@author cafedevn
Contact: cafedevn@gmail.com
Fanpage: https://www.facebook.com/cafedevn
Instagram: https://instagram.com/cafedevn
Twitter: https://twitter.com/CafedeVn
Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
*/

<!DOCTYPE HTML>
<html>

<body>

  <p>Before the script...</p>

  <script>
    alert( 'Hello, world!' );
  </script>

  <p>...After the script.</p>

</body>

</html>

Bạn có thể chạy ví dụ bằng cách nhấp vào copy code trên cho vào lịnk sau và nhấn nút run.(Hầu hêt mọi bài tập hay code sau này bạn có thể vào link trên để chạy code Javascript cho nó nhanh)

Các <script>thẻ chứa code JavaScript được tự động thực hiện khi trình duyệt xử lý thẻ.

2. Các đánh dấu hiện đại hơn(Modern markup)

Các thẻ <script> có một vài thuộc tính ít được sử dụng hiện nay nhưng vẫn có thể được tìm thấy trong code cũ:

Các typethuộc tính:<script type=…>

Tiêu chuẩn HTML cũ, HTML4, yêu cầu một tập lệnh phải có một type. Thông thường nó là type="text/javascript". Nó không còn cần thiết nữa. Ngoài ra, chuẩn HTML hiện đại đã thay đổi hoàn toàn ý nghĩa của thuộc tính này. Bây giờ, nó có thể được sử dụng cho các mô-đun JavaScript. Nhưng đó là một chủ đề nâng cao, chúng ta sẽ nói về các mô-đun trong một phần khác của hướng dẫn.

Các thuộc tính language:<script language=…>

Thuộc tính này có nghĩa là để hiển thị ngôn ngữ của kịch bản(script). Thuộc tính này không còn có ý nghĩa vì JavaScript là ngôn ngữ mặc định, do đó không cần phải sử dụng nó.

Bình luận(comment) trước và sau kịch bản(script).

Trong những cuốn sách và hướng dẫn thực sự cổ xưa, bạn có thể tìm thấy những comments bên trong các thẻ <script>, như thế này:

<script type="text/javascript"><!--
    ...
//--></script>

Thủ thuật này không được sử dụng trong JavaScript hiện đại. Những comments này ẩn khỏi code JavaScript khi các trình duyệt cũ không biết cách xử lý thẻ <script>. Vì các trình duyệt được phát hành trong 15 năm qua không có vấn đề này, nên việc comments này có thể giúp bạn xác định code này thực sự cũ.

3. Tạo các file Kịch bản ở bên ngoài

Nếu chúng ta có nhiều code JavaScript, chúng ta có thể đặt nó vào một tệp riêng.

Các tập tin script được đính kèm với HTML với srcthuộc tính:

<script src="/path/to/script.js"></script>

Ở đây, /path/to/script.jslà một đường dẫn tuyệt đối đến tập lệnh từ trang gốc. Người ta cũng có thể cung cấp một đường dẫn tương đối từ trang hiện tại. Ví dụ, src="script.js"có nghĩa là một tập tin "script.js"trong thư mục hiện tại.

Chúng ta cũng có thể cung cấp một URL đầy đủ. Ví dụ:

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

Để đính kèm một số tập lệnh, sử dụng nhiều thẻ:

<script src="/js/script1.js"></script>
<script src="/js/script2.js"></script>
…

Xin lưu ý: Theo quy định, chỉ các tập lệnh đơn giản nhất được đưa vào HTML. Những cái phức tạp hơn nằm trong các tập tin riêng biệt. Lợi ích của một tệp riêng là trình duyệt sẽ tải xuống và lưu trữ vào bộ đệm(cache) .

Các trang khác tham chiếu cùng một tập lệnh sẽ lấy nó từ bộ đệm thay vì tải xuống, vì vậy tệp thực sự chỉ được tải xuống một lần.

Điều đó làm giảm lưu lượng và làm cho các trang nhanh hơn.

Nếu đặt src, nội dung tập lệnh sẽ bị bỏ qua.

Một thẻ <script> duy nhất không thể có cả srcthuộc tính và code bên trong.

Điều này sẽ không hoạt động:

<script src="file.js">
  alert(1); // the content is ignored, because src is set
</script>

Chúng ta phải chọn một là dùng script bên ngoài <script src="…">hoặc dùng <script> này với code bên trong.

Ví dụ trên có thể được chia thành hai tập lệnh để làm việc:

<script src="file.js"></script>
<script>
  alert(1);
</script>

4. Tóm lược

  • Chúng ta có thể sử dụng thẻ<script> để thêm code JavaScript vào một trang.
  • Các thuộc tính typevà languagekhông bắt buộc.
  • Một tập lệnh trong một tập tin từ bên ngoài có thể được chèn vào <script src="path/to/script.js"></script>.

Có nhiều hơn nữa để tìm hiểu về các tập lệnh trên trình duyệt và sự tương tác của chúng với trang web. Nhưng hãy nhớ rằng phần này của hướng dẫn được dành cho ngôn ngữ JavaScript, vì vậy chúng ta không nên lạc hướng bản thân với các triển khai dành riêng cho trình duyệt. Chúng ta sẽ sử dụng trình duyệt như một cách để chạy JavaScript, rất thuận tiện cho việc học trực tuyến.

Đăng ký kênh youtube để ủng hộ Cafedev nha các bạn, Thanks you!

BÀI VIẾT LIÊN QUANXEM THÊM