javascript기초(html 생성하기)

html 생성하는 법

 

<div id="test">
  
</div>

<script>
  var a = document.createElement('p');  // <p>태그를 생성해줌
  a.innerHTML = '안녕';    // 안에 '안녕'넣기
  document.querySelector('#test').appendChild(a);  //#test <div>에 변수 a 추가
</script>

createElement() 문법을 이용해 태그를 생성

appendChild()로 생성

---

 

 

html 생성하는 법 2

 

<div id="test">
  
</div>

<script>
  var a = '<p>안녕</p>';
  document.querySelector('#test').insertAdjacentHTML('beforeend', a);
</script>

//jQuery 이용

<div id="test">
  
</div>

<script>
  var a = '<p>안녕</p>';
  $('#test').append(a);
</script>

 

변수 a에 문자자료로 html을 만들고 insertAdjacentHTML() 안에 넣어 사용한다.

'beforeend' 는 안쪽 맨 밑에 추가하라는 뜻이다.