[JavaScript] Attribute 값 제거하기

↓↓↓       DOM 개념 알아보기      ↓↓↓

https://yyyeji.tistory.com/160

[JavaScript] DOM이란?

Attribute로 node를 제거하고 싶을 땐 어떻게 할까요?

 

예제로 바로 들어가겠습니다.

 

<bookstore>
    <book category="cooking">
      <title lang ="en"> Everyday Italian</title>
      <author>Giada De Laurentiis</author>
      <year>2005</year>
      <price>30.00</price>
    </book>
    
    <book category="children">
      <title lang = 'en'> Harry Potter </title>
      <author>J K.Rowling</author>
      <year>2005</year>
      <price>29.99</price>
    </book>

    <book category="web">
      <title lang = 'en'> XQuery Kick Start </title>
      <author>James McGovern</author>
      <author>Per Bothner</author>
      <author>Kurt Cagle</author>
      <author>James Linn</author>
      <year>2003</year>
      <price>49.99</price>
    </book>

    <book category="web" cover="paperback">
      <title lang = 'en'> Learning XML </title>
      <author>Erik T. Ray</author>
      <year>2003</year>
      <price>39.95</price>
    </book>
</bookstore>

↑↑↑       Books.xml      ↑↑↑

 

function myFunction(xml) {
    var xmlDoc = xml.responseXML;
    var x = xmlDoc.getElementsByTagName("book");
    document.getElementById("demo").innerHTML =
    x[0].getAttribute('category') + "<br>";

    x[0].removeAttribute('category');
    document.getElementById("demo").innerHTML +=
    x[0].getAttribute('category');
}
</script>

↑↑↑       h.html      ↑↑↑

 

 

x = xmlDoc.getElementsByTagName("book");

→  book 이라는 이름을 가진 tag의 list가 반환됩니다.

 

x[0].getAttribute('category')

→  category라는 attribute의 value를 반환합니다.

 

x[0].removeAttribute('category');

→  category라는 attribute의 value를 제거합니다.

 

 

→  category의 값이 제거되기 전과 후의 결과를 출력합니다.

 

 

document.getElementById("demo").innerHTML =
x[0].getAttribute('category') + "<br>";

x[0].removeAttribute('category');
document.getElementById("demo").innerHTML +=
x[0].getAttribute('category');

◡̈