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] |
'jQuery | javascript | CSS' 카테고리의 다른 글
-- 현재 까지의 jQuery 소스5 -- (0) | 2009.11.11 |
---|---|
43.jQuery - Remove ( 05.Maripulation - 07.Remove ) (0) | 2009.11.11 |
41.jQuery - Clone ( 05.Maripulation - 05.Clone ) (0) | 2009.11.11 |
40.jQuery - Wrap ( 05.Maripulation - 04.Wrap ) (0) | 2009.11.11 |
39.jQuery - Append ( 05.Maripulation - 03.Append ) (0) | 2009.11.11 |
Comments