jQuery 属性操作和CSS 操作

如有在jQuery方法中涉及到函数,此函数必定会返回一个数值(函数由于运行次数不同触发一些不同效果)

jQuery 属性操作方法(以下方法前些日子学习过,不再赘述)

addClass()

 

attr()

hasClass()

html()

removeAttr()

removeClass()

toggleClass()

val()

jQuery CSS 操作函数

css()

$("p").css("color");//取得第一个段落的 color 样式属性的值



$(selector).css(name,value)//设置所有匹配元素的指定 CSS 属性



$(selector).css({property:value, property:value, ...})



$(".btn1").click(function(){

  $("p").css("color","red");

});

 

height()

height() 方法返回或设置匹配元素的高度。



$(selector).height()



$(selector).height(length)



$(".btn1").click(function(){

  $("p").height(50);

});

 

offset()

offset() 方法返回或设置匹配元素相对于文档的偏移(位置)



$(selector).offset()

返回第一个匹配元素的偏移坐标。

该方法返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效



$(selector).offset(value)



$(".btn1").click(function(){

  x=$("p").offset();

  $("#span1").text(x.left);

  $("#span2").text(x.top);//值对,比如 {top:100,left:0}
});//返回或设置的是一个对象,包含.left和.top属性

 

offsetParent()

$(selector).offsetParent()//方法返回最近的祖先定位元素



//定位元素指的是元素的 CSS position 属性被设置为 relative、absolute 或 fixed 的元素。

可以通过 jQuery 设置 position,或者通过 CSS 的 position 属性



$("button").click(function(){

  $("p").offsetParent().css("background-color","red");

});//设置最近的祖先定位元素的背景颜色

 

position()

$(selector).position()//position() 方法返回匹配元素相对于父元素的位置(偏移)(类似offset()),此方法只返回不设置

$(".btn1").click(function(){

  x=$("p").position();

  $("#span1").text(x.left);

  $("#span2").text(x.top);

});

 

scrollLeft()

scrollLeft() 方法返回或设置匹配元素的滚动条的水平位置,滚动条位于最左侧时,位置是 0



$(selector).scrollLeft()//返回第一个匹配元素的水平滚动条位置



$(selector).scrollLeft(position)//设置所有匹配元素的水平滚动条位置



$(".btn1").click(function(){

  $("div").scrollLeft(100);

});选择器为导致滚动条出现的元素

 

scrollTop()

$(selector).scrollTop(offset)//返回或设置



$(".btn1").click(function(){

  $("div").scrollLeft(100);

});

 

width()

$(".btn1").click(function(){

  $("p").width(200);

});//width() 方法返回或设置匹配元素的宽度



$(selector).width()



$(selector).width(length)

 

你可能感兴趣的:(jquery)