jQuery再DOM操作方面提供了一些函数及其用法,这里就对DOM元素的包装简单说明一下,怎样使用会了,对其它方法也能灵活的使用。以下是一个小样例及其效果图。
代码例如以下:
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>演示jquery操作得到的元素</title> <%--引入jquery文件--%> <script type ="text/javascript" src ="jquery-2.1.4.js"></script> <script type ="text/javascript"> $(document).ready(function () { //触发onclick事件 $("#testbutton").click( function () { //使用class为test的元素包裹给定元素 $("p").wrap($(".test")); } ); }); </script> <%--基本样式设定--%> <style type ="text/css"> .test { color :white ; background-color :#ffd800; } .wrap { background-color :green ; } </style> </head> <body> <form id="form1" runat="server"> <div id="content"> <button id="testbutton">測试</button> <br /><br /> <div class ="test"></div> <p id ="first">第一段文字,id为first</p> <p id ="second">第二段文字。id为second</p> <p id ="third">第三段文字,id为third</p> </div> </form> </body> </html>
对于jQuery的使用自己要多多实践,这样才干对它了如指掌啊~
时间: 2024-10-12 15:21:23