装备管理系统项目分析

最新推荐文章于 2025-09-04 18:55:33 发布

weixin_30399055

最新推荐文章于 2025-09-04 18:55:33 发布

阅读量81

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/ccnNL/p/9604617.html

本文探讨了混合开发模式中，如何利用jsAPI如contentDocument及$.getScript处理多层jsp嵌套页面的DOM操作与动态资源加载。同时介绍了postMessageAPI在跨源通信的应用，并强调了在多层iframe嵌套页面中使用top属性的重要性。

整个项目采取的是混合开发模式；

页面的结构是：后台渲染，jsp页面的嵌套，js，jquery直接获取不到jsp页面的<irame>标签里面的dom
采用js API： contentDocument获取jsp嵌套页面的DOM

例如： $("html").contentDocument.getElementById("这个值是iframe标签的ID")，获取完了irame后，在采用常规获取dom的方法获取ifame里面的DOM

注意：jsp页面可能是多层jsp嵌套，也就是多层的irame的嵌套，要多次获取嵌套的iframe标签，再进行dom操作

关于项目中的动态资源加载，采用jquery的getScript()API

$.getScript() 方法通过 HTTP GET 请求载入并执行 JavaScript 文件 $.getScript("xxx.js",fucntion(){xxxxxxxxx})

postMessage API :可以实现跨源通信，两个不同的脚本文件之间

例如: 1111.js window.postMessage("xxx","*") || 2222.js window.addEventListener("message",function(event){ event.data data是事件对象的第一个值 }) ==>存在兼容性问题

当您使用postMessage将数据发送到其他窗口时，始终指定精确的目标origin，而不是*。 恶意网站可以在您不知情的情况下更改窗口的位置，因此它可以拦截使用postMessage发送的数据。

如果这种嵌套多层iframe页面的网页，通常使用到top属性，类比window，top一般指代是否是嵌套顶层页面，常用来做判断实现页面跳转重定向，防止恶意嵌套网页到其他页面，因为其他页面里面嵌套的iframe也能通过dom获取到自己网页数据的数据（比如：用户登陆信息）等，相关属性还有parent，self等

转载于:https://www.cnblogs.com/ccnNL/p/9604617.html