jquery学习笔记3-Dom的操作
1.append() $("div")append("<b>Langhua</b>");向div元素中增加<b>Langhua</b>,是在div里面内容的后面加2.appendTo() $("div")appendTo("<b>Langhua</b>");和append()正好相反3.prepend() 和append正好相反，把内容加到前面4.prependTo() 和appendTo正好相反，也是要把内容加到前面5.after() 在每个元素之后插入内容6.before() 在每个元素之前插入内容================================记住append,after就行了,可以考虑下prepend和before,其它反过来都是一样的删除节点(remove方法)7.$("ul li:eq(1)").remove删除ul中li的第2个元素.8.$("div span").remove("p") 选择性的删除9.$("ul li").remove("li");选择的删除empty方法,不是删除节点，而是清空里面的内容10.$("div").empty();复制节点clone$("div span").click(function(){$(this).clone().appendTo("div");//复制以后新元素不会有任何功能//如想也有这样的功能就这样写$(this).clone(true).appendTo("div")});替换节点11.$("p").replaceWith("<b>Langhua9527</b>");12.$("<b>Langhua9527</b>").replaceAll("p");只是和replaceWith交换了位置13.如果在替换之前,已经为元素绑定事件,替换后原先绑定的事件将会与被替换的元素一起消失,需要在新元素上重新绑定事件.包裹节点14.$("strong").wrap("<b></b>");原来<strong>LangHuA</strong>包裹之后<b><strong>LangHuA</strong></b>;将匹配的元素都包裹上,有多少个包裹多少个15.$("strong").wrapAll("<b></b>");原来<strong>LangHuA1</strong><strong>LangHuA2</strong>包裹之后<b><strong>LangHuA1</strong><strong>LangHuA2</strong></b>(无论多少个只包裹在一起)16.$("strong").wrapInner("<b></b>");原来<strong>LangHuA1</strong><strong>LangHuA2</strong>包裹之后<strong><b>LangHuA1</b></strong><strong><b>LangHuA2</b></strong>(包裹在里面)属性操作17.获得属性:$("p").attr("title");18.设置属性:$("p").attr("title","langhua's title");19.删除属必:$("p").removeAttr("title")样式操作20.获得样式:$("p").attr("class");21.设置样式:$("p").attr("class","topClass");22.追加样式:$("div span").addClass("addNewClass");(如果有相同的属性,后者覆盖前者)23.移除样式:$("#divIdName").removeClass("class1");移除多个样式:$("#xxxxx").removeClass("class1 class2");24.切换样式:$("#divId").toggleClass("aabbcc");25.判断是否有某个样式:$("#langhuaId").hasClass("topClass")html()方法26.$("div").html();//获得div中的内容27.$("div").html("<span>value</span>");//向DIV里面设值text()方法28.$("div").text();//获得DIV里面的text内容29.$("div").text("xiaoLanghua");//设置DIV里面的text内容val()方法30.$("input").val();//获得表单里面的value值31.$("input").val("9527");//设置表单里面的value值html方法是取出的是HTML代码,text只是取出的文字<div>xiao<b>langhua</b></div>html()取的是xiao<b>langhua</b>text()取的是xiaolanghuaval()是取表单里面的值对select设值$("#selectId").val("value");对checkbox设值$("checkbox").value(["value1","value2"]);对radio设值$("radio").value(["value1"]);;遍历节点32.$("div").children(); //获得匹配元素所有的子元素33.$("div").next();//获得匹配元素后面紧跟的同辈元素34.$("div").prev();//获得匹配元素前面紧跟的同辈元素css-dom方法35.$("div").css("color") //获得CSS属性36.$("div").css("color","red");//设置CSS属性37.$("div").css({"color":"red","backgroudColor":"blue"}); //设置多个属性38.$("p").css("opacity","0.5");//设置透明度,ie,firefox都行的39.$("div").height();//获得高度或设置高度,这里面获得的高度和$("div").css("height")获得的不一样,css方法获得的可能是auto,10px等height()方法是元素在页面的实际高度40.width()方法
页:
[1]