06/04/2021, 14:48
hay nhất đổi thuộc tính của thẻ HTML bằng Javascript - Bài tập Javascript
Thuộc tính của thẻ HTML đóng vai trò rất quan trọng trong việc kết hợp giữa HTML và CSS, vì vậy hãy tìm hiểu nó bằng cách trình bày cách thay đổi giá trị của thuộc tính, thêm thuộc tính và xóa thuộc tính của thẻ HTML bằng Javascript. Để thay đổi thuộc tính của thẻ HTML thì chúng ta ...
Để thay đổi thuộc tính của thẻ HTML thì chúng ta sử dụng DOM để truy vấn tới đối tượng HTML cần thay đổi, sau đó sử dụng một số phương thức và thuộc tính liên quan đê xử lý.
Ví dụ: Tạo 2 button và 1 thẻ img, khi click vào button thứ nhất thì đổi hình mới và khi click vào button thứ 2 thì đổi lại hình cũ.
Code
RUN
<div>
<img id="hinhanh" src="https://Zaidap.com.net/upload/tut_post/images/2017/03/29/810/quan-ly-ten-mien-trong-direct-admin.gif" alt="Hình ảnh"/>
</div>
<input type="button" id="btn1" value="Đổi Hình"/>
<input type="button" id="btn2" value="Trở về hình cũ"/>
<script language="javascript">
var hinh1 = 'https://Zaidap.com.net/upload/tut_post/images/2017/03/29/810/quan-ly-ten-mien-trong-direct-admin.gif';
var hinh2 = 'https://Zaidap.com.net/upload/tut_post/images/2016/09/27/746/typescript-basic-types.gif';
document.getElementById("btn1").onclick = function(){
document.getElementById("hinhanh").src = hinh2;
};
document.getElementById("btn2").onclick = function(){
document.getElementById("hinhanh").src = hinh1;
};
</script>Như vậy để thay đổi thuộc tính của thẻ HTML thì ta sử dụng cú pháp sau:
htmlObject.ten_thuoc_tinh = "Giá trị";
Trong đó htmlObject là đối tượng HTML được lấy bằng DOM.
