removeAttribute trong JavaScript và cách xoá thuộc tính của Element | Laptrinhcanban.com

removeAttribute trong JavaScript và cách xoá thuộc tính của Element

Hướng dẫn cách sử dụng removeAttribute trong JavaScript. Bạn sẽ biết cách sử dụng phương thức removeAttribute để xoá thuộc tính chỉ định của một Element sau bài học này.

removeAttribute trong JavaScript

removeAttribute trong JavaScript là một phương thức của Element Object, có tác dụng xoá thuộc tính chỉ định của một Element.

Cú pháp sử dụng thuộc tính removeAttribute trong JavaScript để xoá thuộc tính của Element như sau:

element.removeAttribute(attrName)

Trong đó attrName là tên thuộc tính cần xoá giá trị từ element ban đầu.

Phương thức removeAttribute sẽ xoá đi thuộc tính chỉ định, và nếu như thuộc tính đó chưa thiết lập giá trị, thì sẽ không có gì xảy ra cả.

Ví dụ, chúng ta có thể xoá thuộc tính class của Element chỉ định với cách viết sau:

let element = document.getElementById('box');
element.removeAttribute('class');

Xoá thuộc tính của Element bằng removeAttribute

Hãy cùng xem cách dùng removeAttribute để xoá thuộc tính của một Element như sau:

<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<title>Ví dụ minh hoạ cách dùng removeAttribute </title>
</head>
<body>

<p>Kế hoạch mua sắm</p>

<div id="box">
<a href="http://www.example.com/" target="_blank">Website</a>
<p>Shop mẹ và bé</p>
</div>

<button onClick="getElements();">Xoá thuộc tính</button>

<script>
function getElements(){
let element = document.getElementById('box').children[0];
element.removeAttribute('target');
element.removeAttribute('class');
}
</script>
</body>
</html>

Trong mã HTML ở trên, sau khi click vào nút thì Element con đầu tiên của Element có thuộc tính id="box" sẽ được lấy thông qua phương thức getElementById. Sau đó bằng cách dùng phương thức setAttribute, chúng ta đã xoá đi giá trị của các thuộc tính targetclass của Element này. Và kết quả:

removeAttribute trong JavaScript.

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn cách sử dụng removeAttribute trong JavaScript để xoá giá trị thuộc tính của một Element rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.

Hãy chia sẻ và cùng lan tỏa kiến thức lập trình Nhật Bản tại Việt Nam!

HOME>> >>

Profile
きよしです!笑

Tác giả : Kiyoshi (Chis Thanh)

Kiyoshi là một cựu du học sinh tại Nhật Bản. Sau khi tốt nghiệp đại học Toyama năm 2017, Kiyoshi hiện đang làm BrSE tại Tokyo, Nhật Bản.