스크립트를 사용하여 동적으로 HTML을 삽입할 수 있다.
HTML을 삽입하고자하는 HTML노드를 query를 활용하여 얻고 DOM 스크립트 및 JQuery를 사용하여 작업을 수행한다.
HTML을 삽입하고 자하는 html node를 얻기위해서는 query를 작성해야 하는데 DOM과 jquery 모두 비슷하게 작성한다.
jquery : $("div[data-bind=d01] div article"); DOM: document.querySelector("div[data-binding='do1'] div article"); |
위 예에서 쿼리는 다음과 같이 해석된다.
1. 속성이 "data-bind"이고 값이 "do1"인 div 를 찾고
2. 그 자식 중 div 노드를 찾고
3. 또 그자식 중 article 노드를 찾아라
// jquery 사용 var el = $("div[data-bind=d01] div article"); el.html("hahaha
"); // DOM 사용 var el = document.querySelector("div[data-bind='d01'] div article"); el.innerHTML = "ccccc
";
'Web > Javascript' 카테고리의 다른 글
동적 스타일 시트 ㅣink 삽입 (0) | 2015.11.11 |
---|---|
동적 스타일 적용 및 해제 (0) | 2015.11.11 |
IE 에서 window.getSelection() 실행 되지 않을 때~ (0) | 2015.08.26 |
Grunt 설치 및 js파일 통합 (0) | 2014.10.29 |