JS/JQuery操作iframe元素

简介: JS/JQuery操作iframe元素

JS操作iframe元素

  1. 父页面操作子页面
//获取iframe元素
var oIframe = document.getElementById('iframe1');
oIframe.contentWindow.document.body.style.color = 'red';
  1. 子页面操作父页面;
var oDiv = window.parent.document.body.children[0];
oDiv.style.color = 'red';

JQuery操作iframe

  1. 在父页面中获取iframe中的元素
$(this).contents().find("#suggestBox")
$("#mainiframe").contents().find("someID").html() 
$("#objid",document.frames('iframename').document)
$(window.frames["iframe1"].document).find("#id")
$(window.frames["iframe1"].document).find(”input[@type='radio']“).attr(”checked”,”true”);
  1. 在子页面(iframe)中查找父页面元素
$('#id', window.parent.document)
$('#objId', parent.document);
$(window.parent.document).find(”input[@type='radio']“).attr(”checked”,”true”);
// 调用父页面属性和方法
parent.method
parent.value


相关文章
|
2月前
|
JavaScript
鼠标事件(点击换色)分别使用js和jQuery代码实现
鼠标事件(点击换色)分别使用js和jQuery代码实现
32 1
|
2月前
|
JavaScript
分别用jquery和js修改页面元素
分别用jquery和js修改页面元素
29 2
|
2月前
|
JavaScript Java
点击按钮,向下添加目录。Java script+jQuery写法
点击按钮,向下添加目录。Java script+jQuery写法
17 1
|
2月前
|
JavaScript Java
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
17 1
|
2月前
|
Devops 持续交付 测试技术
JSF遇上DevOps:开发流程将迎巨变?一篇文章带你领略高效协同的魅力!
【8月更文挑战第31天】本文探讨了如何在JavaServer Faces(JSF)开发中融入DevOps文化,通过持续集成与部署、自动化测试、监控与日志记录及反馈机制,提升软件交付速度与质量。文中详细介绍了使用Jenkins进行自动化部署、JUnit与Selenium进行自动化测试、ELK Stack进行日志监控的具体方法,并强调了持续改进的重要性。
31 0
|
2月前
|
JavaScript Java
分别使用java script和jQuery添加页面元素
分别使用java script和jQuery添加页面元素
27 0
|
编解码 JavaScript 前端开发
盘点JavaScript中那些进阶操作知识(下篇)
盘点JavaScript中那些进阶操作知识(下篇)
175 0
|
编解码 JavaScript 前端开发
盘点JavaScript中那些进阶操作知识(上篇)
盘点JavaScript中那些进阶操作知识(上篇)
165 0
|
3月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
78 2
|
3月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
68 4