jquery 或者js 怎么获取页面光标所在的元素

jquery 或者js 怎么获取页面光标所在的元素,第1张

需要准备的材料分别有:电脑、html编辑器、浏览器。

1、首先,打开html编辑器,新建html文件,例如:indexhtml,编写基础代码。

2、在indexhtml中的<script>标签,输入js代码:

var el = windowdocumentbody;

windowdocumentbodyonmouseover = function(event) {

el = eventtarget;

$('body')append('<br/>当前鼠标在' + $(el)html() + '元素上');

}

3、浏览器运行indexhtml页面,此时鼠标移动到123上,会打印出光标在123元素上。

获取页面中元素到文档区域document的横向 纵向坐标的两种方法及其比较

在js控制元素运动的过程中 对于页面元素坐标位置的获取是经常用到的 这里主要总结下两种方法

一 通过叠加元素对象和它的offsetParent(如果存在)的offsetLeft/offsetTop属性来实现

在阅读javascript高级程序设计第三版DOM部分时 了解到要获取某个元素在页面上的偏移量 需要将这个元素的offsetLeft和offsetTop与其offsetParent的相同属性相加 一直循环直至根元素 所以 要得到元素到文档区域的坐标位置 只需通过while循环不断获取offsetParent的offsetLeft/offsetTop直到offsetParent = null为止

js代码

代码如下:

// 获取元素到文档区域的坐标

function getPosition(element) {

var actualLeft = element offsetLeft

actualTop = element offsetTop

current = element offsetParent; // 取得元素的offsetParent

// 一直循环直到根元素

while (current !== null) {

actualLeft += current offsetLeft;

actualTop += current offsetTop;

current = current offsetParent;

}

// 返回包含left top坐标的对象

return {

left: actualLeft

top: actualTop

};

}

例子截图

firebug下测试结果截图 (注 其他浏览器已通过测试!)

二 通过 getBoundingClientRect() 方法实现

getBoundingClientRect方法用于获得页面中某个元素的左 上 右和下分别相对浏览器视窗window的位置 返回的是一个对象 该对象有四个属性 top left right bottom;该方法原本是IE Only的 但是FF +和Opera +已经支持了该方法 可以说在获得页面元素位置上效率有很大的提高 另外 该方法避免使用while循环 而是直接获取数值来实现 比第一种方法性能要好 特别是在复杂的页面上更为明显

js代码

代码如下:

// 获取元素到文档区域的坐标

function getPosition(element){

var dc = document

rec = element getBoundingClientRect()

_x = rec left // 获取元素相对浏览器视窗window的左 上坐标

_y = rec top;

// 与或body元素的滚动距离相加就是元素相对于文档区域document的坐标位置

_x += dc documentElement scrollLeft || dc body scrollLeft;

_y += dc documentElement scrollTop || dc body scrollTop;

return {

left: _x

top: _y

};

}

经测试 该方法与第一种方法获取元素相对于document的坐标大小相同 对于IE低版本浏览器 存在一些差异

注意 记得要累加上(IE除外)或body(针对IE)元素的水平或垂直滚动距离!

lishixinzhi/Article/program/Java/JSP/201311/20207

js获取父页面的元素可以用$(windowparentdocument)find("#customer_id")val();这里的customer_id表示父页面某一个元素的id。

比如:父页面有一个隐藏的input框<input id="customer_id" type="hidden" value="${distributorcustomer_id}"/>,那么在子页面就可以用上述的语句取到父页面的id为customer_id的值。

看名知意,before是前,after是后;

before意为在元素内容之前生成一个伪元素;

after意为在元素内容之后生成一个伪元素;

但如果把before和after的定位都设为absolute脱离了正常的文档流,那其实效果是一样的,

例:<div>我是div元素</div>

before伪元素会显示在 "我" 的前面

after伪元素会显示在 "素" 的后面

首先写获取值的js方法\x0d\displayUpload('uploadDiv3'){\x0d\ // 给相关action传值\x0d\ windowlocation='接收的参数=uploadDiv3;\x0d\}\x0d\在action中有接受的属性\x0d\可使用\x0d\String uploadDiv3 = requestgetP("uploadDiv3"); \x0d\其次\x0d\在jsp页面上\x0d\onclick="JavaScript:displayUpload(传入的值);" \x0d\\x0d\补充回答:\x0d\你想要在哪里判断?\x0d\是在jsp页面上\x0d\还是java程序中\x0d\如果是jsp页面上的话,可以\x0d\function displayUpload(uploadDiv3){\x0d\ if(uploadDiv3==是否等于你的条件){\x0d\ // 如果等于则\x0d\ }else{\x0d\ // 不等于则\x0d\ }\x0d\}

以上就是关于jquery 或者js 怎么获取页面光标所在的元素全部的内容,包括:jquery 或者js 怎么获取页面光标所在的元素、js获取元素到文档区域document的坐标方法、jsd框怎么获得父页面的元素等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/9750466.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-01
下一篇 2023-05-01

发表评论

登录后才能评论

评论列表(0条)

保存