Giới thiệu về JavaScript

JavaScript thay đổi nội dung HTML

Một trong nhiều phương pháp JavaScript HTML là getElementById (). Ví dụ sau sử dụng phương thức “find” tìm một phần tử HTML (với id = “demo”) và thay đổi nội dung phần tử (innerHTML) thành “Hello JavaScript”

document.getElementById(“demo”).innerHTML = “Hello JavaScript”;

JavaScript chấp nhận cả hai dấu ngoặc kép và đơn:

document.getElementById(‘demo’).innerHTML = ‘Hello JavaScript’;

JavaScript thay đổi thuộc tính HTML

Ví dụ này thay đổi một hình ảnh HTML bằng cách thay đổi thuộc tính src (source) của thẻ <img>:

<button onclick=”document.getElementById(‘myImage’).src=’pic_bulbon.gif'”>Turn on the light</button>

<img id=”myImage” src=”pic_bulboff.gif” style=”awidth:100px”>

<button onclick=”document.getElementById(‘myImage’).src=’pic_bulboff.gif'”>Turn off the light</button>

JavaScript thay đổi định dạng CSS

Thay đổi kiểu của một phần tử HTML, là một biến thể của việc thay đổi một thuộc tính HTML:

document.getElementById(“demo”).style.fontSize = “25px”;
or
document.getElementById(‘demo’).style.fontSize = ’25px’;

JavaScript ẩn phần tử HTML

Ẩn các phần tử HTML có thể được thực hiện bằng cách thay đổi kiểu hiển thị:

document.getElementById(“demo”).style.display = “none”;
or
document.getElementById(‘demo’).style.display = ‘none’;

JavaScipt hiện phần tử HTML

Hiển thị các phần tử HTML đang bị ẩn cũng có thể được thực hiện bằng cách thay đổi kiểu hiển thị:

document.getElementById(“demo”).style.display = “block”;
or
document.getElementById(‘demo’).style.display = ‘block’;