어제 오늘 내일

[jQuery] div 안의 텍스트 변경 text(), html() 본문

IT/jQuery

[jQuery] div 안의 텍스트 변경 text(), html()

hi.anna 2023. 12. 30. 06:38

 

 

jQuery를 이용하여

div 안의 텍스트를 변경하려면 다음 2가지 방법을 사용할 수 있습니다.

  • text()
  • html()

 

1. text()

요소 안의 텍스트를 변경합니다.

html 코드를 전달하여도, text로 인식되어 그대로 출력합니다.

 

<div id="myDiv1"></div>
<div id="myDiv2"></div>
$('#myDiv1').text('hello');
$('#myDiv2').text('<button>버튼</button>');

 

 

$('#myDiv1').text('hello');

파라미터로 전달된 텍스트가 그대로 화면에 출력되었습니다.

 

$('#myDiv1').text('<button>버튼</button>');

html 태그를 넣어도 태그가 그대로 화면에 출력됩니다.

 

 

 

2. html()

요소 안의 html을 변경합니다.

파라미터로  html 코드를 전달하면, html 코드가 실행됩니다.

 

<div id="myDiv1"></div>
<div id="myDiv2"></div>
$('#myDiv1').html('hello');
$('#myDiv2').html('<button>버튼</button>');

 

 

$('#myDiv1').html('hello');

텍스트를 파라미터로 전달하면 텍스트가 그대로 출력됩니다.

 

$('#myDiv1').html('<button>버튼</button>');

파라미터로 html 태그를 전달하였습니다.

html 태그가 텍스트로 추가되는 것이 아니라, html로 추가되어 실행됩니다.

 

 

 

반응형
Comments