Phương thức HTML DOM setAttributeNode ()

Phương thức DOM setAttributeNode () đặt một thuộc tính được chỉ định trong tham số của nó thành một phần tử được chỉ định trong tài liệu HTML và trả về giá trị dưới dạng Đối tượng nút Attr.

Cú pháp

Sau đây là cú pháp -

node.setAttributeNode(attributeNode);

Ví dụ

Hãy để chúng tôi xem một ví dụ về phương thức setAttributeNode () -

<!DOCTYPE html>
<html>
<head>
<style>
   html{
      height:100%;
   }
   body{
      text-align:center;
      color:#fff;
      background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
      height:100%;
   }
   .btn{
      background:#0197F6;
      border:none;
      height:2rem;
      border-radius:2px;
      width:35%;
      margin:2rem auto;
      display:block;
      color:#fff;
      outline:none;
      cursor:pointer;
   }
</style>
</head>
<body>
<h1>DOM setAttributeNode() method Demo</h1>
<p>Hi! I'm a para element in HTML with some random text</p>
<button onclick="set()" class="btn">Set Attribute</button>
<script>
   function set() {
      var p=document.querySelector("p");
      var attr=document.createAttribute("style");
      attr.value="color:#db133a;font-size:1.2rem;";
      p.setAttributeNode(attr);
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Phương thức HTML DOM setAttributeNode ()

Nhấp vào “ Đặt thuộc tính ”Để đặt thuộc tính style cho phần tử

Phương thức HTML DOM setAttributeNode ()