<div class="container"> <div class="inner">Hello</div> <div class="inner">Goodbye</div> </div>
$('.inner').wrapInner('<div class="new" />');
<div class="container"> <div class="inner"> <div class="new">Hello</div> </div> <div class="inner"> <div class="new">Goodbye</div> </div> </div>
.wrapInner( wrappingElement ) .wrapInner( function(index) )
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> p { background:#bbf; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("p").wrapInner("<b></b>"); }); </script> </head> <body> <p>Hello</p> <p>cruel</p> <p>World</p> </body> </html>
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> div { border:2px green solid; margin:2px; padding:2px; } p { background:yellow; margin:2px; padding:2px; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("body").wrapInner("<div><div><p><em><b></b></em></p></div></div>"); }); </script> </head> <body> Plain old text, or is it? </body> </html>
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> p { background:#9f9; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("p").wrapInner(document.createElement("b")); }); </script> </head> <body> <p>Hello</p> <p>cruel</p> <p>World</p> </body> </html>
<html> <head> <title>ThaiCreate.Com jQuery Tutorials</title> <style> p { background:#9f9; } .red { color:red; } </style> <script type="text/javascript" src="jquery-1.6.4.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("p").wrapInner($("<span class='red'></span>")); }); </script> </head> <body> <p>Hello</p> <p>cruel</p> <p>World</p> </body> </html>
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน Source Code 2.0 ของทีมงานไทยครีเอท