<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body{
margin: 0;
padding: 0;
}
mdiv{
width: 100px;
height: 100px;
background-color: #097df3;
}
</style>
</head>
<body>
<div style="height: 1000px"></div>
<div class="mdiv"></div>
<script src="jquery-211minjs"></script>
<script>
//原生
//获取div距离顶部的距离
var mTop = documentgetElementsByClassName('mdiv')[0]offsetTop;
//减去滚动条的高度
var sTop = documentbodyscrollTop;
var result = mTop - sTop;
consolelog(result);
//Jquery
mTop = $('mdiv')[0]offsetTop;
sTop = $(window)scrollTop();
result = mTop - sTop;
consolelog(result);
</script>
1$(window)height();//是文档窗口高度；
2$("div")offset()top//是标签距离顶部高度（没有到下面的距离，比如$("div")offset()down）；
3$("div")offset()left//是标签距离右边高度（没有到下面的距离，比如$("div")offset()right）；
4$(document)scrollTop();//是滚动条高度；
5$("div")height();//是标签高度。
1jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。
2jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件
以上就是关于如何从网页代码中看出一个元素到浏览器顶端的距离全部的内容，包括:如何从网页代码中看出一个元素到浏览器顶端的距离、jquery怎么获取元素距离屏幕的位置、等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）