本文实例讲述了jQuery中DOM操作的方法。分享给大家供大家参考。具体分析如下： 这里主要设计的dom操作包括：dom对象的创建(JS方式和jquery方式)、属性的修改、样式的修改、动态绑定事件 代码如下： 复制代码 代码如下: http://www.w3.org/1999/xhtml"> 动态创建对象 测试图层 获取自定义数据-1 获取自定义数据-2 <br> //document.getElementById("testDiv").innerHTML = "<div style="border:solid 1px #FF0000">动态创建的div</div>";<br> var testDiv = document.getElementById("testDiv");<br> var select = document.createElement("select");<br> select.options[0] = new Option("加载项1", "value1");<br> select.options[1] = new Option("加载项2", "value2");<br> select.size = "2";<br> var object = testDiv.appendChild(select);<br> $("img").each(function(index) {<br> this.alt = "changed";//修改dom属性信息<br> //alert("index:" index ", id:" this.id ", alt:" this.alt);<br> });<br> $("#inputTest").removeAttr("readonly");<br> //alert($("#inputTest").attr("readonly"));<br> $(function()<br> {<br> alert("attr("width"):" $("#testDiv").attr("width"));//undifined<br> alert("css("width"):" $("#testDiv").css("width"));//auto(ie6) 或1264px(ff)<br> alert("width():" $("#testDiv").width()); //正确的数值1264<br> alert("style.width:" $("#testDiv")[0].style.width ); //空值<br> })<br> //动态绑定单击事件<br> $("#testDiv5").bind("click", function(event)<br> { alert($(event.target).attr("customer")); });<br> //绑定只执行一次的单击事件<br> $("#testDiv6").one("click", { customer: "customer data 2",a:"aaa" }, function(event)<br> { alert(event.data.customer) });<br> 希望本文所述对大家的jQuery程序设计有所帮助。
