1.JavaScript là gì ?
JavaScript là một ngôn ngữ lập trình bổ sung tính tương tác cho một trang web. Điều này xảy ra trong trò chơi, trong hành vi phản hồi khi các nút được nhấn hoặc khi nhập dữ liệu trên biểu mẫu, với hoạt động ảnh,…v.v.
Thẻ <script> được sử dụng để xác định tập lệnh JavaScript
Thẻ <script> chứa các câu lệnh script hoặc nó trỏ đến một tệp script bên ngoài thông qua thuộc tính src
Các ứng dụng phổ biến của JavaScript là thao tác hình ảnh, xác thực biểu mẫu và các thay đổi chủ động của nội dung
Để chọn một phần tử HTML, JavaScript thường sử dụng cú pháp document.getElementByld ()
Ví dụ:
Ở đây, tôi dùng JavaScript để thay đổi văn bản bên trong thẻ <p> thành “Hello JavaScript!”
2.Các thao tác bằng JavaScript trong HTML
2.1 Thay đổi bằng JavaScript
2.1.1 Thay đổi nội dung bằng JavaScript
Để thay đổi nội dung trong HTML ta sử dụng cú pháp:
document.getElementById("tên id").innerHTML ="nội dung thay đổi";
Ví dụ:
2.1.2 Thay đổi kiểu bằng JavaScript
Để thay đổi kiểu trong HTML ta sử dụng cú pháp:
- Thay đổi font chữ:
document.getElementById("tên id").style.fontSize ="kích cỡ thay đổi";
- Thay đổi màu chữ:
document.getElementById("tên id").style.color ="màu thay đổi";
- Thay đổi nền:
document.getElementById("tên id").style.backgroundColor ="màu thay đổi";
Ví dụ:
2.1.3 Thay đổi các thuộc tính
Để thay đổi các thuộc tính trong HTML ta sử dụng cú pháp:
document.getElementById("tên id").thuộc tính="nội dung thay đổi";
Ví dụ:
Ở đây, tôi sử dụng JavaScript để thay đổi đường dẫn của hai hình ảnh thông qua các nut bấm
2.2 Thẻ <noscript>
Thẻ <noscript> trong HTML xác định nội dung thay thế sẽ được hiển thị cho người dùng đã tắt tập lệnh trong trình duyệt hoặc trình duyệt không hỗ trợ tập lệnh
Ví dụ:
<p id="demo"></p> <script> document.getElementById("demo").innerHTML = "lập trình từ đầu"; </script> <noscript>Xin lỗi, trình duyệt của bạn không hỗ trợ JavaScript!</noscript>
Ở đây, nếu trình duyệt không hỗ trợ JavaScript nên nội dung văn bản bên trong thẻ <noscript> được hiện lên màn hình