首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js、jQuery 获取文档、窗口、元素各种

基于两年开发经验,总结了 javascript、jQuery 获取窗口、文档、元素各种 javascript: 文档:是整个document所有的内容 浏览器当前窗口文档body宽度: document.body.clientWidth...: 鼠标相对于页面左上角偏移 (其会受滚动条影响,相当于整个文档,整个页面的Y) IE9之下并不支持这个属性 clientY: 鼠标相对于浏览器窗口左上角偏移...在当前触发鼠标事件元素和它祖先元素中找到最近具有定位属性元素,计算鼠标与其偏移, 以找到元素border左上角外交点作为相对点。...如果找不到具有定位属性元素,那么就相对于当前页面计算偏移,此时等同于pageY。...另外offsetY并不在乎触发事件元素是否有定位属性,它总是相对于触发事件元素来计算偏移

14.1K32
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JS offsetParent属性获取最近上级定位元素

    js中,offsetParent 属性表示最近上级定位元素。...要获取相对父级元素位置,可以先判断 offsetParent 属性是否指向父元素,如果是,则直接使用 offsetLeft 和 offsetTop 属性获取元素相对于父元素距离;否则分别获得当前元素和父元素距离窗口坐标...//获取指定元素距离父元素左上角偏移坐标//参数:e表示获取位置元素//返回:返回对象直接量,其中属性x表示x轴偏移距离,属性y表示y轴偏移距离function getP (e) { if...offsetLeft属性 var y = e.offsetTop; //读取offsetTop属性 } else { //否则调用getW()扩展函数获取元素偏移位置,并返回它们差值..."x" : x, "y" : y },}下面调用该扩展函数获取指定元素相对父元素偏移坐标。

    7.7K40

    JS实现动态获取当前点击事件id属性

    整个页面是通过ajax请求最新4部视频进行填充完成,视频列表又是通过template-web.js插件补上去,所以导致所有ID都是一样,一开始给按钮添加一个事件,结果是所有播放按钮都是播放第一个视频...于是,想了好多办法,又把ID属性给弄成动态ajax请求属性,实现了每个id不一样,接下来,因为点击播放要调用一个方法,进行解析视频播放,拼接成API+视频链接格式在新打开弹窗进行展示。...具体可以看下图: 要实现点击不同按钮,并且按钮ID是动态从ajax请求获取,还要添加点击视频拼接视频链接,参考了文章,可以获取点击按钮id,然后使用button,将链接放在value中 Dom...对象id属性可以获取元素id。...-- HTML结构 --> 播放 // javascript

    25.9K20

    js获取元素几种形式

    通过id获取元素 document.getElementById('div');//获取id为div元素 通过class获取 document.getElementsByClassName('top'...);//获取页面中所有的class为top元素集合 通过标签名获取 document.getElementsByTagName('p');//获取页面中所有的标签为p元素集合 通过name获取 document.getElementsByName...('user');//获取页面中所有的name为user元素集合 注意:通过class,name标签名抓取元素是一个集合,即使该类只有一个符合要求元素目标,也返回是一个集合,因此可以存储变量,通过变量名...抓取class为例 var tops=document.getElementsByClassName('top');//抓取页面所有class为top集合 tops[0]为第一个符合....简单可以将返回的当做一个存储符合数组,通过下标进行找到指定位置. 当然也可以使用数组方法返回,集合目标数. alert(tops.length)可以提示出class为top目标数

    25.3K30

    jquery获取第几个子元素_js获取元素指定子元素

    ,比如说(“.boldstyle“)会选择CSS为boldstyle类元素; 标签 名#id.class:通过某类元素id属性和class属性来选择,如:(a#blog.boldStyle)会选择id...通过子选择器,容器选择器和属性选择器进行选择: *:匹配所有元素,比如说:(*)会把页面中所有元素都返回; E:匹配标签名为E所有元素,如(“a”)返回所有链接元素; E F:匹配父元素E下标签名为...F所有元素(F可以为E子类子类,甚至更远); E>F:匹配父元素E下所有标签名为F直接子元素; E+F:匹配所有标签名为F元素,并且有E类型兄弟节点在该F元素之前(E,F紧挨着); E~...F:匹配前面是任何兄弟节点E所有元素F(E,F不必紧挨着); E:has(F):匹配标签名为E,至少有一个标签名为F后代节点所有元素E; E.C:匹配带有类名C所有元素E。....C等效于*.C; E#I:匹配id为I所有元素E,#I等效于*#I; E[A]:匹配带有属性A所有元素E; E[A=V]:匹配所有属性A为V元素E; E[A^=V]:匹配所有元素E,且A属性

    27.2K30

    jsattr用于设置属性

    需要注意是,display: none 样式将使元素被完全隐藏且不会占用空间,因此在折叠元素中使用该样式可以有效地控制页面布局和交互效果。...使用 attr() 方法修改 CSS 样式不生效是因为该方法主要用于设置元素属性,而非样式。虽然某些属性可能会影响元素呈现效果,但这并不是它们本意和正确用法。...该方法可以通过接受一个样式属性名和键值对来直接修改元素样式,例如: $("#collapseExample").css("display", "none"); 此外,还可以同时设置多个样式属性,甚至动态地计算样式...,并在页面上实时更新元素样式,非常灵活和方便。...总之,使用 .css() 方法是修改元素样式正确和推荐方式,而不是使用 attr() 方法。

    61130

    js 中使用idx模块方便获取链条式对象属性

    背景 从一个js对象属性属性再次获得,或者从集合中获得元素再获得属性要写很多判断是否空表达式,才能继续读取,否则就出现异常。...这在开发过程很繁琐事情,idx 模块就是来解决这个问题可选方案之一。...从这个 user 里取出 第一个 friends 属性要可能要这么写: props.user && props.user.friends && props.user.friends[0] && props.user.friends...2.知识 ' idx '是一个用于遍历对象和数组上属性实用函数。 如果中间属性为空或未定义,则返回空。idx 目的是简化从链中提取属性过程,省得每次写各种判空条件以方便开发。...idx 这个模块是作为权宜之计存在,因为JavaScript目前还没有直接可选“链条式读取属性支持”。

    8K10

    如何在 WPF 中获取所有已经显式赋过依赖项属性

    获取 WPF 依赖项属性时,会依照优先级去各个级别获取。这样,无论你什么时候去获取依赖项属性,都至少是有一个有效。有什么方法可以获取哪些属性被显式赋值过呢?...如果是 CLR 属性,我们可以自己写判断条件,然而依赖项属性没有自己写判断条件地方。 本文介绍如何获取以及显式赋值过依赖项属性。...---- 需要用到 DependencyObject.GetLocalValueEnumerator() 方法来获得一个可以遍历所有依赖项属性本地。...} } 这里 value 可能是 MarkupExtension 可能是 BindingExpression 还可能是其他一些可能延迟计算提供者。...因此,你不能在这里获取到常规方法获取依赖项属性真实类型。 但是,此枚举拿到所有依赖项属性都是此依赖对象已经赋值过依赖项属性本地。如果没有赋值过,将不会在这里遍历中出现。

    19540

    js:如何获取select选中

    我想获取select选中value,或者text,或者…… 比如这个: <option value=”A” url=”http://www.baidu.com...text: myselect.options[index].text; 5:拿到选中项其他,比如这里url: myselect.options[index].getAttribute(‘url’...); 二:jQuery方法 1:var options=$(“#select option:selected”); //获取选中项 2:alert(options.val()); //拿到选中项...3:alert(options.text()); //拿到选中项文本 4:alert(options.attr(‘url’)); //拿到选中项url 版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人...本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

    26.7K30
    领券