上一篇里边介绍了在里边利用iframe引入另一个html导航文件,有兴趣的朋友可以看一看 http://www.cnblogs.com/simba-lkj/p/6031662.html

目前遇到一些问题们,想要在引用了iframe的文件里修改iframe里边的样式。

解决了这个问题,整理一下,供大家参考

demo:

<div class="iframe">

<iframe src="header.html" width="100%" height="442px" marginwidth="0" frameborder="no" scrolling="no"></iframe>

</div>

1、这是我首先考虑的一个方法

获取iframe引入的html文件元素通过id获取

要在网页加载完之后再进行这段代码 
window.onload = function(){
 var test = document.getElementById('iframe的id').contentWindow.document.getElementById('iframe里要获取的元素的id');
 console.log(test);
 test.style.display = "none";
}
 
2、可以在iframe文件js里获取父网页的相对路径,将相对路径存储在一个数组中,通过判断相对路径 来进行操作

实例:

var URL  = window.parent.location.pathname;

路径数组:

var arrURL = ["/CASE/aishuoke/index.html","/CASE/aishuoke/about.html","/CASE/aishuoke/news.html","/CASE/aishuoke/download.html","/CASE/aishuoke/case.html","/CASE/aishuoke/job.html","/CASE/aishuoke/shownews.html",

"/CASE/aishuoke/showinfo.html","/CASE/aishuoke/showimg_first.html","/CASE/aishuoke/showimg_second.html","/CASE/aishuoke/showimg_third.html","/CASE/aishuoke/showimg_forth.html"];

switch (URL){

case arrURL[0]:

$("#shouye").addClass("show").siblings().removeClass("show");

break;

}

 
总结:

在iframe中获取父窗口的元素

$('#父窗口中的元素ID', parent.document).click();jquery

在父窗口中获取iframe中的元素 

1、:var test = $("#iframe的ID").contents().find("#iframe中的控件ID");//jquery 方法1

  var test2 =  $("#iframe中的控件ID",document.frames("frame的name").document);//jquery 方法2

  var test3 = document.getElementById('iframe的id').contentWindow.document.getElementById('iframe里要获取的元素的id');//js方法
 
 转载请注明出处,谢谢合作*-* http://www.cnblogs.com/simba-lkj/p/6032458.html
 

在iframe父界面获取iframe里面的标签的更多相关文章

  1. iframe父页面获取iframe子页面的元素 与 iframe子页面获取父页面元素

    一.在iframe子页面获取父页面元素代码如下:$('#objld', parent.document); 二.在父页面获取iframe子页面的元素代码如下:$("#objid", ...

  2. js 在iframe子页面获取父页面元素,或在父页面 获取iframe子页面的元素的几种方式

    用JS或jquery访问页面内的iframe,兼容IE/FF 注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.html 文件内含有一个iframe: XML/HTML代码 ...

  3. iframe父页面获取子页面的高度

    最近做项目中用到了iframe,子页面更改父页面的高度,经过九九八十一难,找到了解决的办法. $(window).load(function() {  var h=$(document).height ...

  4. iframe父页面获取子页面的参数

    1.父页面中的iframe <iframe name="parentPage"></iframe> 2.子页面中元素的属性 <input type=& ...

  5. iframe父页面获取子页面元素方法

    1.window.frames["iframe的id"].contentDocument.getElementsByClassName("mycontainer" ...

  6. javascript获取iframe框架中页面document对象,获取子页面里面的内容,iframe获取父页面的元素,

    javascript获取iframe框架中,加载的页面document对象 因为浏览器安全限制,对跨域访问的页面,其document对象无法读取.设置属性 function getDocument(i ...

  7. iframe父页面和子页面获取元素和js变量

    父页面获取iframe页面元素和变量 获取方法:$("#id")[0].contentWindow.showInfo(): 获取元素:  $("#id").co ...

  8. js获取iframe和父级之间元素,方法、属,获取iframe的高度自适应iframe高度

    摘自:http://blog.csdn.net/kongjiea/article/details/38870399 1.在父页面 获取iframe子页面的元素 (在同域的情况下 且在http://下测 ...

  9. iframe子页面获取父页面元素的方法

    在iframe子页面获取父页面元素 代码如下: $.('#objld', parent.document); 在父页面获取iframe子页面的元素 代码如下: $("#objid" ...

随机推荐

  1. 测试 Prism 语法高亮

    测试 Prism 对 C 语言的语法高亮 #include <stdio.h> #include "math.h" int main(void) { long int ...

  2. C#控制台项目更改运行文件

    这个是极光推送的C# demo,里面有几个文件,要先后运行.这是第一次遇见,所以一下子找不到北,摸索了好一会儿才知会.于是做了这面一个记录. 右击鼠标,查看属性弹出这个这面,然后选择要启动的对象.保存 ...

  3. Java8-Function使用及Groovy闭包的代码示例

    导航 定位 概述 代码示例 Java-Function Groovy闭包 定位 本文适用于想要了解Java8 Function接口编程及闭包表达式的筒鞋. 概述 在实际开发中,常常遇到使用模板模式的场 ...

  4. java socket 多线程通讯

    1.目录结构 2.Server.java 代码 package de.bvb.server; import java.net.ServerSocket; import java.net.Socket; ...

  5. abrt-hook-ccpp: Saved core dump of pid 12224导致dn挂掉问题

    一.引言: 最近发现datanode老是无缘无故的进程挂掉,从程序的日志没有stop迹象,只能从/var/log/messages入手,发现如下信息: 从namenode的页面也可以看到进程消息的时间 ...

  6. 一个ubuntu phper的自我修养(atom)

    将atom打造成二十一世纪最装那啥的php IDE 之前在windows平台使用的php IDE一直是eclipse for php,因为之前做java开发,所以对eclipse很有感情,debug. ...

  7. 《利用python进行数据分析》读书笔记--第九章 数据聚合与分组运算(一)

    http://www.cnblogs.com/batteryhp/p/5046450.html 对数据进行分组并对各组应用一个函数,是数据分析的重要环节.数据准备好之后,通常的任务就是计算分组统计或生 ...

  8. Java 动态生成复杂 Word

    Java 动态生成复杂 Word 阅读目录 1. 制作 Word 模版,将你需要动态生成的字段用${}替换.2. 将 Word文档保存为 xml .3. 引入项目. 项目中需要用 java 程序生成d ...

  9. JavaScript对象的chapterI

    对象: 对象就是由一些彼此相关的属性和方法集合在一起而构成的一个数据实体. 一.本地对象: 1.Date——日期对象 var myDate = new Date(); myDate.getFullYe ...

  10. GOLANG 基本数据类型 整型

    基本数据类型-整型 种类     有符号(负号)      int8 int16 int32 int64 无符号(无符号) uint8 uint16 uint32 uint64 架构特定(取决于系统位 ...