Phương thức setAttributeNode() trong JavaScript dùng để gắn một đối tượng attr chứa thuộc tính và giá trị của thuộc tính vào phần tử HTML, chi tiết như nào hãy cùng chúng tôi phân tích:

Phương thức setAttributeNode() trong JavaScript

Chức năng của Phương thức setAttributeNode() trong JavaScript

Phương thức setAttributeNode() trong JavaScript dùng để gắn một đối tượng attr chứa thuộc tính và giá trị của thuộc tính vào phần tử HTML.

Code Phương thức setAttributeNode() trong JavaScript

Phương thức setAttributeNode() href trong JavaScript

Gắn thuộc tính href và phần tử HTML:

<a id="aid">Liên kết</a>
<p>Click vào nút THÊM HREF để thêm thuộc tính href</p>
<button onclick="themHref()">THÊM HREF</button>
<script>
function themHref() {
 // Tạo dối tượng attr đại diện cho thuộc tính href
const attr = document.createAttribute("href");
// Tạo giá trị cho thuộc tính href
attr.value = "https://webmoi.vn/phuong-thuc-createattribute-href-trong-javascript/";
// Gắn thuộc tính href vào phần tử id aid
document.getElementById("aid").setAttributeNode(attr);
}
</script>

Chạy Thử

Phương thức setAttributeNode() style trong JavaScript

Gắn thuộc tính style vào phần tử HTML:

<div id="divid">Đổi màu sau khi click</div>
<p>Click vào nút THÊM STYLE để thêm thuộc tính style</p>
<button onclick="themStyle()">THÊM STYLE</button>
<script>
function themStyle() {
 // Tạo dối tượng attr đại diện cho thuộc tính style
const attr = document.createAttribute("style");
// Tạo giá trị cho thuộc tính style
attr.value = "color:red";
// Gắn thuộc tính style vào phần tử id divid
document.getElementById("divid").setAttributeNode(attr);
}
</script>

Chạy Thử

Phương thức setAttributeNode() class trong JavaScript

Gắn thuộc tính class vào phần tử HTML:

<!DOCTYPE html>
<html>
<head>
<title>Phương thức setAttributeNode() class trong JavaScript</title>
<style>
.divclass{color:red}
</style>
</head>
<body>
<div id="divid">Đổi màu sau khi click</div>
<p>Click vào nút THÊM CLASS để thêm thuộc tính class</p>
<button onclick="themClass()">THÊM CLASS</button>
<script>
function themClass() {
 // Tạo dối tượng attr đại diện cho thuộc tính class
const attr = document.createAttribute("class");
// Tạo giá trị cho thuộc tính class
attr.value = "divclass";
// Gắn thuộc tính class vào phần tử id divid
document.getElementById("divid").setAttributeNode(attr);
}
</script>
</body>
</html>

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Phương thức setAttributeNode() trong JavaScript.

5/5 - (1 Đánh giá)
0 Bình luận

Bùi Tấn Lực

CEO Bùi Tấn Lực người sáng lập ra Web Mới, là một lập trình viên website, người viết content, chuyên tư vấn các vấn đề về website và SEO website

Chia sẻ nội dung đánh giá của bạn về Phương thức setAttributeNode() trong JavaScript
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Bình luận, Hỏi đáp

Đăng ký tư vấn miễn phí

Tìm hiểu 1 năm không bằng lắng nghe 1 câu tư vấn