jQuery选择器及属性设置

最近用到了许多jQuery选择器相关,所以回顾总结下:

(一)

直接父级:.parent();方法返回被选元素的直接父元素
所有父级:.parents();  方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素html
(二)
同级:.siblings() 方法返回被选元素的所有同胞元素
    例子:$("h2").siblings("p");  返回属于<h2>的同胞元素的所有<p>元素
所有同级:nextAll() 方法返回被选元素的所有跟随的同胞元素
区域同级:nextUntil() 方法返回介于两个给定参数之间的所有跟随的同胞元素
(三)
直接子元素:children() 方法返回被选元素的所有直接子元素
所有子元素:find() 方法返回被选元素的后代元素,一路向下直到最后一个后代

(例子)

当前元素的上一个元素:$("").parent().prev().css("background","red")

当前元素的下一个元素:$("").parent().next().css("background","red")

当前元素父元素:$("").parent().css("background","red")

当前元素子元素:$("").children().css("background","red")

 

 

样式相关:增加样式.addClass();设置/改变样式:$(".logo").css("border","none")

 

属性与样式之.attr()与.removeAttr(),通过一定的触发事件来使一些元素上增加或者删除一些属性
例子:禁用与激活按钮

$("#btnSendCode").attr("disabled","true");   //禁用
$("#btnSendCode").removeAttr("disabled");  //启用按钮,启用激活

.attr():

1、获取匹配元素的属性,例如:$("img").attr("src");
2、设置匹配元素的属性,例如:
                                单一属性的设置:$("img").attr("src","test.jpg");
                                 多个属性的设置:$("img").attr({ src: "test.jpg",alt: "Test Image" });
3、$("img").attr("title",function() { return this.src });

 

.removeAttr():

1.从每一个匹配的元素中删除相应的属性
          删除一个属性:$("img").removeAttr("src");
          删除多个属性:$("img").removeAttr("src alt");//img的src和alt都会被删除

 

2.平常的使用中我们还可以通过如下这种方法来进行删除
           $("img").attr("src","");      

           $("img").attr({src:"",alt:""});
.removeAttr()和.attr()使用这两方法的区别在于页面html的结构不同
      removeAttr直接将这个属性删除,在页面中看到的就是这个结果<img>
      attr不会删除这个属性,只是将这个属性的值置为空,在页面中看到的就是<img src alt>,实际上和<img src="" alt=""> 的效果是一样的

 

相关文章

jQuery插件的种类 1、封装对象方法 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进...
扩展jQuery插件和方法的作用是非常强大的,它可以节省大量开发时间。 入门 编写一个jQuery插件开始于给...
最近项目中需要实现3D图片层叠旋转木马切换的效果,于是用到了jquery.roundabout.js。 兼容性如图: ht...
一、什么是deferred对象? 开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异...
AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一...