jQuery 学习笔记（4）（文本值相关方法、操控CSS方法、位置和尺寸方法）

1、文本值相关方法

　　.html() == .innerHTML

　　$("div").html("<span> 。。。</span>") //设置HTML代码片段

　　$("div").html() //获取HTML代码片段

 

　　.text == .innerText

　　$("div").text("。。。") //设置text文本值

　　$("div").text()　　//获取文本值

 

　　.val() == .value

　　$("input").val("...")　　//设置value值

　　$("input").val()　　//获取value值

 

2、操控CSS样式的方法

　　$("div").css("backgroundColor", "#fff");　　//逐个设置CSS样式值

　　$("div").css({　　　　//批量设置CSS样式值

　　　　width: "100px",

　　　　height: "100px"

　　})；

　　$("div").css("width");　　//获取CSS 样式值

 

3、位置和尺寸方法

　　.width([val | fn])　　//获取/设置元素的宽度/高度

　　.height([val | fn])

　　$("div").height("200px")

　　$("div").height(function(index,height) { return height+ index*10 })

 

　　.offset()

　　.offset({　　　　//设置offset偏移值（相对于body）

　　　　left: "10px",

　　　　top: "20px

　　})

　　.offset().left/top　　获取offset偏移值

 

　　.position()

　　.position()　　/获取position值（相对于其定位素）

　　注意：.position()只能用于获取样式值不能设置

 

　　.scrollTop()/.scrollLeft()

　　.scrollTop()　　//获取滚动偏移位置

　　.scrollTop("300px")　　//设置滚动偏移位置

　　注意：获取页面滚动位置：$("html").scrollTop() + $("body").scrollTop()

　　　　　设置页面滚动位置： $("html, body").scrollTop("300px")