美文网首页
javascript-DOM基本操作(2)

javascript-DOM基本操作(2)

作者: html_dingling | 来源:发表于2016-05-09 19:04 被阅读0次

1.视口坐标和文档坐标
a.视口坐标(窗口坐标):相对window(浏览器可视范围)左上角,会根据滚动条的变化 而变化. 可视高度/宽度:document.documentElement.clientHeight/clientWidth;
getBoundingClientRect() 返回视口坐标,和高宽.
b.文档坐标:相对整个文档左上角,固定不变的.
获取文档坐标函数:
function getPosition(ele){
var oP=ele.offsetParent;
var x=ele.offsetLeft;
var y=ele.offsetTop;
while(oP){
x=x+oP.offsetLeft+oP.clientLeft;
y=y+oP.offsetTop+oP.clientTop;
oP=oP.offsetParent;
}
return {x:x,y:y}
}

Paste_Image.png

2.JSON数据字符串转化成数组
a.JSON.parse() [常用]
b.使用eval("("+json+")");
c.(new Function("return " + json)())

相关文章

  • javascript-DOM基本操作(2)

    1.视口坐标和文档坐标a.视口坐标(窗口坐标):相对window(浏览器可视范围)左上角,会根据滚动条的变化 ...

  • JavaScript-DOM操作

    JavaScript-DOM操作 1.DOM DOM(document object model),文档对象模型。...

  • Javascript-DOM基本操作总结(1)

    1.元素获取方法a.获取单个元素:document.getElementById('idNname');docum...

  • JavaScript-DOM操作

    本文为叩丁狼高级讲师原创文章,转载请注明出处。 在之前的文章中,学习过了DOM的访问方式,其中也把DOM相关的概念...

  • JavaScript-DOM操作

    在之前的文章中,学习过了DOM的访问方式,其中也把DOM相关的概念进行了学习,其实DOM的内容还有很多,所以本文将...

  • 09、JavaScript-DOM操作

    每天一句:成长的速度取决于在过程中发现和解决问题的速度,最终这是一个量变引发质变的过程; DOM(Document...

  • lupengday01

    变量及类型 列表 基本操作1 基本操作2

  • vector, 哈希与错误的基本操作

    1, vector的基本操作 2,哈希 map基本操作 3,错误操作

  • MongoDB(2)——基本操作

    数据库 查看当前数据库名称,默认的数据库为test 列出所有在物理上存在的数据库 切换数据库,则指向数据库,但不创...

  • mysql基本操作(2)

    输入net start mysql 回车即可启动sql yog 输入net stop mysql 回车即可关闭。 ...

网友评论

      本文标题:javascript-DOM基本操作(2)

      本文链接:https://www.haomeiwen.com/subject/sqksrttx.html