JavaScript được kết nối với HTML như thế nào?

JavaScript, còn được gọi là JS, là một trong những ngôn ngữ kịch bản [kịch bản phía máy khách], thường được sử dụng trong phát triển web để tạo các trang web hiện đại và tương tác. Thuật ngữ "script" được sử dụng để chỉ các ngôn ngữ không độc lập về bản chất và ở đây nó đề cập đến JavaScript chạy trên máy khách

Nói cách khác, chúng ta có thể nói rằng thuật ngữ kịch bản được sử dụng cho các ngôn ngữ yêu cầu sự hỗ trợ của ngôn ngữ khác để được thực thi. Ví dụ: các chương trình JavaScript không thể được thực thi nếu không có sự trợ giúp của HTML hoặc không được tích hợp vào mã HTML

JavaScript được sử dụng theo nhiều cách trong các trang web như tạo thông báo cảnh báo, xây dựng thư viện hình ảnh, thao tác DOM, xác thực biểu mẫu, v.v.

Thêm JavaScript vào các trang HTML

Có ba cách sau để người dùng có thể thêm JavaScript vào các trang HTML

  1. mã nhúng
  2. mã nội tuyến
  3. tệp bên ngoài

Chúng ta sẽ thấy ba trong số họ từng bước

I. mã nhúng. -

Để thêm mã JavaScript vào các trang HTML, chúng ta có thể sử dụng thẻ của HTML bao quanh mã JavaScript bên trong chương trình HTML. Người dùng cũng có thể xác định mã JavaScript trong thẻ [hay có thể nói là phần nội dung] hoặc thẻ vì nó hoàn toàn phụ thuộc vào cấu trúc của trang web mà người dùng sử dụng

Chúng ta có thể hiểu điều này rõ ràng hơn với sự trợ giúp của một ví dụ, cách thêm JavaScript vào html

Ví dụ

đầu ra

Chúng tôi cũng có thể xác định mã JavaScript trong thẻ hoặc phần nội dung

Hãy hiểu thông qua một ví dụ

đầu ra

II. mã nội tuyến. -

Nói chung, phương thức này được sử dụng khi chúng ta phải gọi một hàm trong thuộc tính sự kiện HTML. Có nhiều trường hợp [hoặc sự kiện] trong đó chúng tôi phải thêm mã JavaScript trực tiếp, ví dụ:. , sự kiện OnMover, OnClick, v.v.

Hãy xem với sự trợ giúp của một ví dụ, cách chúng ta có thể thêm JavaScript trực tiếp vào html mà không cần sử dụng thẻ

Hãy xem ví dụ

đầu ra

III. tệp bên ngoài. -

Chúng tôi cũng có thể tạo một tệp riêng để chứa mã JavaScript bằng [. js] và sau đó kết hợp/đưa nó vào tài liệu HTML của chúng tôi bằng cách sử dụng thuộc tính src của thetag cũng không được sử dụng trong đó

Phần tử noscript HTML

Phần tử cung cấp cho chúng tôi một cách khác để tạo nội dung cho người dùng có trình duyệt không hỗ trợ JavaScript hoặc đã tắt JavaScript trong trình duyệt

Đưa các trang web của bạn lên cấp độ tiếp theo bằng cách khai thác JavaScript. Tìm hiểu trong bài viết này cách kích hoạt JavaScript ngay từ tài liệu HTML của bạn

điều kiện tiên quyết. Bạn cần làm quen với cách tạo một tài liệu HTML cơ bản. Khách quan. Tìm hiểu cách kích hoạt JavaScript trong tệp HTML của bạn và tìm hiểu các phương pháp hay nhất quan trọng nhất để giữ cho JavaScript có thể truy cập được

Giới thiệu về JavaScript

JavaScript là ngôn ngữ lập trình chủ yếu được sử dụng phía máy khách để làm cho các trang web tương tác. Bạn có thể tạo các trang web tuyệt vời mà không cần JavaScript, nhưng JavaScript mở ra một cấp độ khả năng hoàn toàn mới

Ghi chú. Trong bài viết này, chúng ta sẽ xem xét mã HTML mà bạn cần để JavaScript có hiệu lực. Nếu bạn muốn tự học JavaScript, bạn có thể bắt đầu với bài viết cơ bản về JavaScript của chúng tôi. Nếu bạn đã biết điều gì đó về JavaScript hoặc nếu bạn có nền tảng về các ngôn ngữ lập trình khác, chúng tôi khuyên bạn nên xem trực tiếp Hướng dẫn về JavaScript của chúng tôi

Cách kích hoạt JavaScript từ HTML

Trong trình duyệt, JavaScript không tự làm bất cứ điều gì. Bạn chạy JavaScript từ bên trong các trang web HTML của mình. Để gọi mã JavaScript từ bên trong HTML, bạn cần có phần tử . Có hai cách để sử dụng script, tùy thuộc vào việc bạn đang liên kết với tập lệnh bên ngoài hay nhúng tập lệnh ngay trong trang web của mình

Liên kết một tập lệnh bên ngoài

Thông thường, bạn sẽ viết kịch bản theo cách riêng của họ. tập tin js. Nếu bạn muốn thực hiện một. js từ trang web của bạn, chỉ cần sử dụng với thuộc tính src trỏ đến tệp tập lệnh, sử dụng URL của nó


Viết JavaScript trong HTML

Bạn cũng có thể thêm mã JavaScript giữa các thẻ thay vì cung cấp thuộc tính src


  window.addEventListener["load", [] => {
    console.log["This function is executed once the page is fully loaded"];
  }];

Điều đó thuận tiện khi bạn chỉ cần một chút JavaScript, nhưng nếu bạn giữ JavaScript trong các tệp riêng biệt, bạn sẽ thấy dễ dàng hơn

  • tập trung vào công việc của bạn
  • tự viết HTML
  • viết các ứng dụng JavaScript có cấu trúc

Sử dụng tập lệnh dễ tiếp cận

Khả năng truy cập là một vấn đề chính trong bất kỳ sự phát triển phần mềm nào. JavaScript có thể làm cho trang web của bạn dễ truy cập hơn nếu bạn sử dụng nó một cách khôn ngoan hoặc nó có thể trở thành thảm họa nếu bạn sử dụng tập lệnh một cách cẩu thả. Để làm cho JavaScript hoạt động có lợi cho bạn, bạn nên biết về một số phương pháp hay nhất nhất định để thêm JavaScript

Chủ Đề