$('.con').offset().top;//jq中offset（）是相對於視口
var con = document.getElementsByClassName('con')[0];
// console.log(con.offsetTop);//原生JS中若父級有定位，則相對與父級，若父級無定位，則相對於視口
// console.log(con.offsetWidth);//原生JS中offsetWidth是該元素的content + padding + border
// console.log(con.style.width);//原生JS只能獲取該元素的行間樣式的width值，若引入css樣式則無法獲取width值，而且設置的值也只是設置在行間樣式上
// console.log(con.clientWidth);//原生JS中clientWidth = content + padding值之和，同理cilentHeight
// con.addEventListener('mouseenter', function(e) {
// // console.log(e.clientX); 返回當前鼠標點擊點的座標，相對於視口的座標
// console.log(e.clientX)//相對於文檔的點擊座標
// console.log(e.offsetX);//相對於父元素的點擊座標
// }, false)
console.log(con.clientTop);//clientTop查看的是當前元素的額border像素值
console.log(con.clientLeft)//同理 查看當前元素的border像素值
pageX() 屬性是鼠標指針的位置，相對於文檔的左邊緣。同理pageY也是相對於文檔的位置
scrollWidth:獲取對象的滾動寬度
scrollHeight: 獲取對象的滾動高度。
scrollLeft:設置或獲取位於對象左邊界和窗口中目前可見內容的最左端之間的距離
scrollTop:設置或獲取位於對象最頂端和窗口中可見內容的最頂端之間的距離
//innerHeight獲取或者設置元素內視口的高度 同理innerWidth
// $('.footer').innerHeight()//獲取的值是content+padding的值
// $('.footer').innerHeight(200);//設置的值是content + padding的值
//outerWidth 設置或者獲取元素外視口的寬度 同理outerHeight
$('.footer').outerWidth();//獲取的值爲content+padding + border的值
$('.footer').outerWidth(200);//設置的值爲content+padding+border的總和值$('.footer').outerHeight(true);//獲取的值爲content+padding+border+margin的值
$('.footer').outerHeight(300,true);//設置的值爲content+padding+border+margin的值的總合