<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
p{
font-size: 30px;
color: green;
/*width: 2000px;*/
height: 8000px;
}
button{
position: fixed;
bottom:0;
top:0;
}
</style>
<script src="js/jquery-3.1.0.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function(){
獲取css樣式 :css()方法;
不管css屬性是行內的還是頭部或者外部。只要在標簽上生效，都可以拿到該屬性的值，js只能獲取到行內的css屬性;
var $bgColor = $('p').css('background-color')
console.log($bgColor);
var $color = $('p').css('color');
console.log($color)
設置css樣式: css()方法;
添加在行內樣式表中,參數值如果有單位則一定要帶上單位
$('p').css('font-size','50px')
css方法一次添加多個樣式
$('p').css({
'font-size':'16px',
'color':'black'
})
設置、獲取元素的高度:height()
參數值可以為數值類型，當值是數值時默認為px ;如果以其他單位為高度單位,需要傳遞包含單位類型的字符串
var $height = $('p').height();
console.log($height);
$('p').height('60%');
設置、獲取寬度等同高度的設置
設置、獲取元素相對于文檔的偏移量 獲取到的值是一個對象，可以通過訪問left和top屬性的形式獲取到該標簽相對于html標簽(瀏覽器邊框)的左側和頂部的偏移量
任何類型的標簽，都可以通過這個方法設置獲取/偏移量
var $offset = $('p').offset();
console.log($offset);
console.log('left:'+$offset.left+'top:'+$offset.top);*/
設置標簽相對于文檔的偏移量
//(寫法一)
//var obj = {top:100,left:100};
//$('p').offset(obj);
//(寫法二)
//$('p').offset({top:100,left:100})
獲取標簽相對于父標簽(子標簽必須參照父標簽定位)的偏移量 :position 方法
/*var $position = $('p').position();
console.log($position);*/
注意: position 只能獲取值，不能設置值
獲取、設置水平滾動條的的位置 scrollLeft();
/*var $scrollLeft = $('p').scrollLeft();
console.log($scrollLeft);*/
注：首先必須先確認要操作滾動條是屬于哪個標簽,在獲取到滾動條對應的標簽后,在設置scrollLeft才會生效
設置：
//$('body').scrollLeft(500);
//$(window).scrollLeft(500);
//$(document).scrollLeft(500);
設置、獲取垂直滾動條的位置
獲取：
/*var $scrollTop = $('p').scrollTop();
console.log($scrollTop);*/
eg:
通過jQuery獲取到按鈕，添加點擊事件中在點擊事件中設置滾動條的位置到返回頂部的目的
$('body').scrollTop(3000);
$('button').click((function){
$(document).scrollTop(0);
});
})
</script>
</head>
<body>
<p style="background-color: yellow;">地我定的那男的</p>
<button>回頂部</button>
</body>
</html>
