`
deng131
  • 浏览: 673570 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

动态创建iframe设置属性name问题

阅读更多
通常iframe的name可以是link或者form的target,将link或form打开到这个iframe上。
在js中一般采用
var iframe = document.createElement('iframe');   
iframe.setAttribute('name', 'node') or iframe.name ="node" 

创建iframe,但是在不同浏览器上就出现问题了,ie6中iframe.setAttribute('name', 'node');中方式无法创建,在FF中可以创建name.

直接google解决IE方法
var iframe = document.createElement('<iframe name="node"></iframe>');  

那么就需要判断浏览器类别。

网上参考方法:
 try{   
     var iframe = document.createElement('<iframe name="ifr"></iframe>');   
    }catch(e){  
        var iframe = document.createElement('iframe');   
        iframe.name = 'ifr';   
  }  

感觉这种方式还是有写搓,明知有错,为什么还要try..catch呐?个人认为还是通过判断浏览器来使用不同创建方式:
var fm = document.all ? document.createElement('<iframe name="ifr"></iframe>') :
document.createElement('iframe');   

参考:
http://stackoverflow.com/questions/2138564/dynamic-iframe-ie-name-issue
http://bytes.com/topic/javascript/answers/836613-whtas-story-document-createelement-iframe-ie



分享到:
评论

相关推荐

    IE中document.createElement的iframe无法设置属性name的解决方法

    然而,一个常见的问题是在Internet Explorer(IE)浏览器中,通过`document.createElement`创建的`iframe`元素无法设置`name`属性,这可能导致一些功能无法正常工作,例如链接或表单的目标定位。 `name`属性对于`...

    jquery得到iframe src属性值的方法

    window.parent属性在iframe中使用,指的是创建iframe页面的窗口对象。在主页面中,window对象和window.parent是同一个对象,但在嵌入的iframe页面中,window.parent指的是包含当前iframe的父窗口对象。 7. ...

    完美解决iframe跨域问题

    3. **iframe跨域问题**:当iframe加载的页面与包含它的页面不在同一个域时,就会出现跨域问题,导致无法直接通过JavaScript进行通信,如获取iframe内的内容、设置iframe的属性等。 **二、iframe跨域的解决方案** 1...

    JS动态添加iframe的代码

    JS动态添加iframe的代码是一种前端编程技术,主要用在网页中动态创建并嵌入iframe元素。该技术在制作弹出窗口、广告模块或者嵌入第三方网页时尤其有用。在本文中,将介绍几种不同的方法来实现JS动态添加iframe的功能...

    iframe 跨域解决方法

    `iframe`加载完成后,将其`name`属性设置为需要传递的数据,然后在父页面中通过读取`iframe.contentWindow.name`获取数据。 4. **`JSONP`(JSON with Padding)**:适用于只支持GET请求的API。通过动态创建`...

    javascript中兼容主流浏览器的动态生成iframe方法

    在JavaScript中,动态生成...在这个例子中,我们通过检查`document.all`属性来识别IE浏览器,然后根据浏览器类型采用不同的创建iframe的方法。同时,对于跨域通信和异步数据获取,我们还展示了如何利用iframe进行处理。

    js动态创建上传表单通过iframe模拟Ajax实现无刷新

    form标签的创建和提交:在JavaScript中,可以使用document.createElement方法动态创建一个form元素,通过设置其action属性为服务器处理上传的URL,method属性为post,并指定其target属性为上面创建的iframe的name值...

    IFRAME自适应

    要解决这个问题,可以在IFRAME的`src`页面设置`&lt;meta name="referrer" content="same-origin"&gt;`或`&lt;meta http-equiv="X-Frame-Options" content="allow-from https://example.com"&gt;`,或者服务器端设置适当的CORS...

    测试iframe

    其中,`src`属性定义了要加载的URL,`width`和`height`分别设置iframe的宽度和高度。 2. **`iframe`的安全性和同源策略** 由于安全原因,浏览器实施了同源策略,这意味着`iframe`只能加载与包含它的页面同源的...

    iframe框架中实现打开多窗口方法

    在`frameset`布局中,通过设置每个子框架的`name`属性,可以创建多个不同的显示区域。然后,利用`&lt;a&gt;`标签的`target`属性指向这些框架的`name`,从而实现在特定框架中打开新链接的功能。例如: ```html ,*" name=...

    关于iframe的用法

    在`mywebneed`这个项目中,你可以考虑创建一个动态的导航栏,其中包含多个iframe元素,每个iframe加载不同的子页面。通过调整iframe的大小和布局,可以实现类似tab切换的效果,同时保持页面的加载速度和用户体验。 ...

    iframe与父页面传值

    - 动态加载:根据用户操作动态改变`iframe`的内容。 总结来说,`iframe`与父页面传值涉及的技术包括`postMessage`、`window.name`、查询字符串、hash等,并且需要注意跨域安全和同源策略的限制。这些技术在实际开发...

    Iframe交互语法

    3. **window.name**:在跨域场景下,可以通过设置`window.name`属性实现数据的持久化存储,因为即使页面刷新,`window.name`的值也会保留。 ### 四、优化策略 1. **延迟加载**:使用`IntersectionObserver` API或`...

    测试iframe全

    在这个"测试iframe全"的场景中,可能包括创建不同类型的`iframe`测试,比如跨域加载、沙盒测试、动态调整大小、安全设置验证等,以全面掌握`iframe`的使用。同时,文件列表中的"helloworld"可能是测试项目的一个起点...

    html iframe

    不过,有一些例外,比如`srcdoc`属性可以用来在`iframe`中动态创建内容,或者`sandbox`属性可以创建一个沙盒环境,限制`iframe`的行为。 2. **命名与通信**:`iframe`可以通过`name`属性来命名,便于通过`window....

    iframe大全

    `iframe`的使用可以解决很多问题,例如加载外部内容、实现广告投放、创建浮动菜单等。本篇文章将深入探讨`iframe`的相关知识点。 ### 1. iframe基本结构 `iframe`标签是HTML5中的一个元素,用于在当前文档中嵌入另...

    iframe与frame的区别

    总的来说,`frame`适合创建固定的多窗口布局,而`iframe`更适合需要动态插入和更新内容的场景,或者在保持页面整体结构不变的情况下,灵活展示不同内容的需求。在实际应用中,开发者应根据项目需求、浏览器兼容性和...

    如何使用iframe

    iframe属性 - **src**: 指定要加载的外部网页URL。 - **width**: 设置`iframe`的宽度。 - **height**: 设置`iframe`的高度。 - **name**: 给`iframe`一个名称,可以用于通过JavaScript或者HTML表单来引用这个框架...

    Iframe使用帮助

    【Iframe 使用帮助】 Iframe,全称 Inline Frame,是...总的来说,理解和熟练运用Iframe,可以帮助开发者创建更动态、交互性更强的网页,同时要注意处理好浏览器兼容性和安全性问题,以确保用户能获得良好的浏览体验。

Global site tag (gtag.js) - Google Analytics