前端面试之如何获取一个iframe的scrollTop

前端面试之如何获取一个iframe的scrollTop


我的脚本正在运行在iframe本身,父窗口在另一个域,所以我无法访问iframe的ID或任何类似的

本次给大家推荐一个免费的学习群,里面概括移动应用网站开发,css,html,webpack,vue node angular以及面试资源等。 对web开发技术感兴趣的同学,欢迎加入Q群:864305860,不管你是小白还是大牛我都欢迎,还有大牛整理的一套高效率学习路线和教程与您免费分享,同时每天更新视频资料。 最后,祝大家早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。

您可以使用此设置设置scrollTop:$("html,body").scrollTop(25);
复制代码

所以你可以尝试这样做:

$("html,body").scrollTop();
复制代码

因为不同的浏览器将scrollTop设置在不同的元素(body或html)上.

从scrollTo插件:

但是在某些浏览器中可能仍然会失败.以下是Ariel Flesher’s scrollTo plugin for jQuery源代码的相关部分:

// Hack, hack, hack :)
// Returns the real elements to scroll (supports window/iframes, documents and regular nodes)
$.fn._scrollable = function(){
 return this.map(function(){
 var elem = this,
 isWin = !elem.nodeName || $.inArray( elem.nodeName.toLowerCase(), ['iframe','#document','html','body'] ) != -1;
 if( ! isWin ) {
 return elem;
 }
 var doc = (elem.contentWindow || elem).document || elem.ownerDocument || elem;
 return $.browser.safari || doc.compatMode == 'BackCompat' ?
 doc.body : 
 doc.documentElement;
 });
};
复制代码

然后您可以运行:

$(window)._scrollable().scrollTop();
复制代码

确定iframe向下滚动的距离


转载于:https://juejin.im/post/5bc4a24e6fb9a05ce87407e6

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值