修改css样式+jq中的效果+属性操作+元素操作

　　　　:checked    选框选中的

　　　一、修改css样式：

　　　　1.参数只写属性名，则返回属性值

　　　　　　$(this).css( ' color ');   //300px

　　　　2.参数是属性名，属性值，逗号分隔，是设置一组样式，属性必须加引号，值如果是数字可以不用跟单位和引号

　　　　　　$(this).css(" color "," red ") ; //设置当前元素的字体颜色是红色

　　　　3.参数可以是对象形式，方便设置多组样式，属性名和属性值用冒号隔开，属性可以不加引号，如果是复合属性必须采用驼峰法命名：

　　　　　　$(this).css({

　　　　　　　　color : " red "，

　　　　　　　　width : "300px",

　　　　　　　　backgroundColor : " pink "  //复合属性采用驼峰法命名

　　　　　　})

　　　　二、jq中的效果：

　　　　　　show()：显示　　　hide()：隐藏　　　　toggle()：切换

　　　　　　slideDown()：下滑显示　　　　slideUp()：上滑隐藏　　　　slideToggle()：滑入滑出切换

　　　　　　fadeIn()：淡入效果　　　　fadeOut()：淡出效果　　　　fadeToggle()：淡入淡出效果　　　　fadeTo()：修改透明度

　　　　　三、属性操作：

　　　　　　　　常用的获取属性值的语法：

　　　　　　　　　prop( )：获取元素本身固定的属性值    // $("a").prop("href") ;  //获取 a 标签中 href 的属性值

　　　　　　　　　prop("href","#");   // 给href属性赋值 #

　　　　　　　　　attr( )： 获取自定义的属性值        //   $( "div" ).attr("data-index") ;    //  获取div中自定义的index的属性值 

　　　　　　　　　attr("index",2) ;   //  给index赋值是2 

　　　　

　　　　　　　　　data( )：数据缓存 data（），数据是存放在元素的内存里面    // data("uname","Tom");

　　　　　　　　　$("div").data("index");   //这个方法获取data-index  h5自定义属性 ：不用写data-  而且返回的是数字型

　　　　    四、元素操作：

　　　　　　1，遍历

　　　　　　　　第一种方式遍历 ：

　　　　　　　　　　 each(function(index,element))；

　　　　　　　　第二种方式遍历：

　　　　　　　　　　$.each(object,function(index,element){ xxx; })

　　　　　　　　　　　　1.$each( )方法可用于遍历任何对象，主要用于数据处理，比如数组，对象

　　　　　　　　　　　　2.里面的函数有2个参数：index是每个元素的索引号；element遍历内容

　　　　　　　　　　var   arr=["红色"，"绿色"，"蓝色"]；

　　　　　　　　　　$.each(arr,function(i,ele){

　　　　　　　　　　　　console.log(i);   //索引号

　　　　　　　　　　　　console.log(ele);   //值

　　　　　　　　　　})

　　　　　　　　　　例2：

　　　　　　　　　　<ul><li>周一</li><li>周二</li><li>周三</li></ul>

　　　　　　　　　　$.each($("ul li"),function(i,ele){

　　　　　　　　　　　　console.log(i);    // 获取 li 中的索引号

　　　　　　　　　　　　console.log(ele);  //获取li中的每个值

　　　　　　　　　　})

　　　　　　2，创建

　　　　　　　　var li =$("<li>创建一个新元素</li>");

　　　　　　　　var  div  =$("<div>创建一个新的</div>")

　　　　　　　　//  内部添加  append 

　　　　　　　　　$("ul").append(li);  //  内部添加并且放到内容的最后面

　　　　　　　　//  内部添加   prepend

　　　　　　　　　$("ul").prepend(li)  //  内部添加并且放到内容的最前面

　　　　　　　　//  外部添加   after

　　　　　　　　　$(".test").after(div);  //   外部添加并且放到内容的最后面

　　　　　　　　//  外部添加   before

　　　　　　　　　$(".test").before(div);  //   外部添加并且放到内容的最前面

　　　　　　　　<ul>

　　　　　　　　　　<li>原先的li</li>

　　　　　　　　</ul>

　　　　　　　　<div class="test">

　　　　　　　　　　div元素

　　　　　　　　</div>

　　　　　　3，删除元素

　　　　　　　　　　//  remove

　　　　　　　　$("ul").remove();  //   删除匹配的元素    自杀

　　　　　　　　　　//   empty

　　　　　　　　$("ul").empty();   //   删除匹配元素里面的子节点    孩子

　　　　　　　　　　//   html(" ")

　　　　　　　　$("ul").html(" ");   //   删除匹配元素里面的子节点    孩子