JQUERY-TEXT

임재헌·2023년 3월 29일

JQUERY

목록 보기
3/16
<!DOCTYPE html>   
<html lang="ko"> 
<head>
    <meta charset="UTF-8">
<title>03_text </title> 
<style>
    
</style>
<!-- jquery import -->
<script src="jquery-3.6.4.min.js"></script>  
</head>
<body>
  <h3>text()와 html 함수</h3> 
<button>입력!!</button>
<hr>
<div id="text"></div>
<div id="html"></div>
<script>

//본문에 있는 button 요소 접근
$("button").click(function(){
    //alert();

    let txt="<img src='../images/devil.png'>"

    // javascript
    // document.getElementById("text").innerText=txt;   문자 그대로 출력
    // document.getElementById("html").innerHTML=txt;   html 문서로 출력

    //jquery
    $("#text").text(txt);   // 단순 문자열
    $("#html").html(txt);   // 문자열이 마크업되면서 요소 출력

});
    
</script>
</body>
</html>

0개의 댓글