JavaScript trong HTML

Trong HTML, JavaScript giúp trang web linh động và có tính tương tác cao hơn. JavaScript đóng vai trò khá quan trọng đối với các trang web. Nếu bạn muốn kiểm chứng điều này, có thể thử tắt JavaScript trên trình duyệt và duyệt web thử xem có điều gì bất thường nhé.

• JavaScript là gì? Internet có thể tồn tại mà không có JavaScript hay không?
• Bật và tắt JavaScript trên trình duyệt Chrome
• Mảng và đối tượng trong JavaScript giống như cuốn truyện và tờ báo!

Bạn có thể copy đoạn code dưới đây và chạy thử trên trình duyệt để thấy được một chút xíu về việc JavaScript sẽ giúp ích cho các trang web như thế nào nhé.

<h1>My First JavaScript</h1>

<button type="button"
onclick="document.getElementById('vidu').innerHTML = Date()">
Click để hiển thị ngày tháng.</button>

<p id="vidu"></p>

 Thẻ <script> trong HTML

Thẻ <script> được dùng để định nghĩa kịch bản bên phía client (JavaScript). Phần tử <script> có thể chứa các câu lệnh hoặc trỏ tới một tập tin kịch bản khác qua thuộc tính src.

JavaScript thường được dùng cho việc hiển thị hình ảnh, xác thực mẫu biểu và việc thay đổi linh động các nội dung. Để chọn phần tử HTML, JavaScript thường dùng phương pháp document.getElementById().

<script>
document.getElementById("demo").innerHTML = "Xin chào JavaScript!";
</script>

Một số ví dụ về JavaScript

Thay đổi nội dung HTML

document.getElementById("demo").innerHTML = "Xin chào JavaScript!";

Thay đổi kiểu cách trong HTML

document.getElementById("demo").style.fontSize = "25px";
document.getElementById("demo").style.color = "red";
document.getElementById("demo").style.backgroundColor = "yellow";

Thay đổi thuộc tính HTML

document.getElementById("image").src = "picture.gif";

Thẻ <noscript> trong HTML

Thẻ <noscript> thường dùng để đưa ra nội dung thay thế cho người dùng đã vô hiệu hóa kịch bản trên trình duyệt, hoặc trình duyệt không hỗ trợ kịch bản về phía client.

<script>
document.getElementById("demo").innerHTML = "Xin chào JavaScript!";
</script>
<noscript>Xin lỗi, trình duyệt của bạn không hỗ trợ JavaScript!</noscript>

Bài trước: Iframe trong HTML

Bài sau: Đường dẫn tập tin trong HTML