01、操作元素的属性

$(function(){$("#but").click(function(){//获得元素的对象var  inp=$("#zh");//JQ获得属性   inp.attr("value")：获得的默认的值console.log(inp.attr("type")+"----"+inp.attr("name")+"----"+inp.attr("value"));/* console.log(inp[0].type);//js方式获得对象var inp2=document.getElementById("but");//获得对象实时输入的值console.log(inp.val());//操作元素对象属性inp.attr("type","button");inp.attr("value","点击");//综合的方式 {key1:value1,key2:value2 }--json数据格式inp.attr({"type":"button","value":"点击"});//checkedalert($("#man").attr("checked"));//true  一般作用到checked、disabled、selectedalert($("#man").prop("checked")); })})

02、操作元素的css样式

					//获得div元素对象var div =$("#div1");//获得元素对象的样式console.log(div.css("width")+"---"+div.css("height"));//操作元素的样式//[1]直接加样式div.css("width","300px");div.css("height","300px");div.css("backgroundColor","red");//综合的方式div.css({"width":"400px","height":"300px","backgroundColor":"red"});//[2]通过增加class属性的方式添加css样式 div.attr("class","div2");//只可以增加class属性div.addClass("div2");//移除指定的class div.removeClass("div2")

03、操作元素的内容

				//获得div对象var div =$("#div1");//js==  innerHTML  --可以包含html内容var  ht = div.html();//js== innerText ---只是包含纯文本var  te= div.text();console.log(ht);console.log(te);//可以实现累加div.html(div.html()+"<b>是一家很好的公司</b>"); //不会识别html内容div.text("<b>是一家很好的公司</b>");

04、操作元素的节点

				//创建节点：var p =$("<p>List Item5</p>");//  内部--现有元素之后//   $("#div1").html($("#div1").html()+"<p>List Item5</p>")$("#div1").append(p);-----√           // 内部---现有元素之前$("#div1").prepend(p);//外部 ---现有元素之前$("#div1").before(p); //外部---现有元素之后$("#div1").after(p);var  div2=$("#div2"); var  div1=$("#div1");$("#div1").append(div2);// 把指定的元素追加到对应元素内容中----现有元素之后$("#div2").appendTo(div1);$("#div1").prepend(div2);//把指定的元素追加到对应元素内容中----现有元素之前$("#div2").prependTo(div1);//移除整个div对象    $("#div1").remove();     //内容清空$("#div1").empty();