42.jQuery - ReplaceWith ( 05.Maripulation - 06.ReplaceWith )
06.ReplaceWith.htm |
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<title>검색된 요소를 변경하기</title>
<style type="text/css">
button { display:block;
margin:3px;
color:Red;
width:200px;
}
div { color:Red;
border:2px solid blue;
width:300px;
margin:3px;
text-align:center;
}
</style>
<script src="../jQuery/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{ //모든 버튼 요소를 클릭시 $("button").click(function() { //나 자신(버튼)을 <div> 태그로 변경하자. $(this).replaceWith("<div>" + $(this).text() + "</div>"); });
});
</script>
</head> <body>
<button>First</button>
<button>Second</button>
<button>Third</button> </body> </html> |
결과화면 |
[그림42-1] |