HTML DOM trong JavaScript – Thay đổi CSS
HTML DOM cho phép JavaScript để thay đổi định dạng của các phần tử HTML. Thay đổi định dạng HTML Để thay đổi kiểu của một phần tử HTML, hãy sử dụng cú pháp sau: document.getElementById( id ).style. property = new style Ví dụ sau thay đổi định dạng của ...
HTML DOM cho phép JavaScript để thay đổi định dạng của các phần tử HTML.
Thay đổi định dạng HTML
Để thay đổi kiểu của một phần tử HTML, hãy sử dụng cú pháp sau:
document.getElementById(id).style.property = new style
Ví dụ sau thay đổi định dạng của một phần tử <p>:
<html>
<body><p id=”p2″>Hello World!</p>
<script>
document.getElementById(“p2”).style.color = “blue”;
</script><p>The paragraph above was changed by a script.</p>
</body>
</html>
Sử dụng sự kiện
HTML DOM cho phép bạn thực thi mã khi một sự kiện xảy ra. Sự kiện được tạo ra bởi trình duyệt khi “mọi thứ xảy ra” với các phần tử HTML:
- Một phần tử được nhấp vào
- Trang đã tải
- Các trường nhập được thay đổi
Ví dụ này thay đổi phong cách của phần tử HTML với id = “id1”, khi người dùng nhấp vào một nút:
<!DOCTYPE html>
<html>
<body><h1 id=”id1″>My Heading 1</h1>
<button type=”button”
onclick=”document.getElementById(‘id1’).style.color = ‘red'”>
Click Me!</button></body>
</html>
- Học lập trình front-end cơ bản với bootstrap 4/html5/css3
- Học lập trình front-end nâng cao qua Project thực tế
- Học thiết kế web với Photoshop, CSS theo kiểu SASS
- Học cách sử dụng Git_hub cho lập trình viên
- Học lập trình Back-end PHP theo mô hình MVC cơ bản
- Học lập trình Back-end PHP theo mô hình MVC nâng cao
- Học lập trình Cơ sở dữ liệu với AngularJS
- Học lập trình theme wordpress. Làm ra mọi website hoàn chỉnh với wordpress
- Combo lập trình front-end từ cơ bản – nâng cao
- Combo lập trình back-end từ cơ bản đến nâng cao
- Combo lập trình web với word press từ A-Z