03/15-1

Posted by:

|

On:

|

Node 관련 몇몇가지

  • createElement-요소(태그) 생성
  • createAttribute-속성 생성
  • createTextNode-텍스트 생성
  • 이 3개를 입력해도 js에서만 생성되었기 때문에 html에 추가가 안되어 있다.
  • addpendChild-현재 노드 안에 자식 노드 생성
  • setAttributeNode-현재 노드 안에 속성 추가
  • 이 2가지를 이용해서 html에도 효과가 나타나게 할 수 있다.
  • remove-통으로 제거
  • removeChild-자식노드 제거
  • removeAttribute-현재노드의 속성 제거
  • 제거 방법은 2가지가 있다. remove(접근할 곳) 또는 접근할 곳.remove()인데 전자의 경우 제거한 값을 return으로 남길 수 있지만 후자는 return값이 없다.
  • 더욱이 html에서만 제거이기 때문에 1,2,3,4 리스트를 만들고 1을 제거하면 2,3,4 가 남고 번호도 1만 지운 형태로 나온다.

textNode,textContent,innerHTML 셋 다 텍스트를 수정해주는 기능이다. 차이점은 innerHTML은 태그를 넣으면 태그는 반영이 되지만 ,나머지 둘은 문자열을 그대로 출력해준다.

복제 : let 복제할 개체명=기존객체명.colneNode(true);

  • 이를 쓰는 이유는 다른 곳에도 쓰고 싶어서 다른 곳에 쓰게 되면 그전에 쓰던 곳에서는 없어지게 된다. 즉, 1개만 사용이 가능하기에 복제를 해서 다른곳에서 쓸 때 기존것이 없어지는 것을 방지하기 위해서다. 그리고 복제한 것을 고쳐써도 기존것은 기존것 그대로 남아있다.

classlist : CSS의 클래스에 대한 것.

  • remove : 제거, add : 추가(여러개를 추가하고 싶다면 ,를 쓰면 된다), toggle : 토클(on/off)