zoukankan      html  css  js  c++  java
  • 在iframe父界面获取iframe里面的标签

    上一篇里边介绍了在里边利用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
     
  • 相关阅读:
    MyEclipse2014中SVN的使用方法
    使用Navicat V8.0创建数据库,外键出现错误ERROR 1005: Can’t create table (errno: 121)
    个人简历
    Android Studio集成SVN报错:can't use subversion command line client : svn
    面向对象原型的七种方法详解(前)
    js中return的用法
    面试题总结
    Ajax 是什么?Ajax 的交互模型?同步和异步的区别?如何解决跨域问题?以及 HTTP状态码
    css3实现的3中loading动画效果
    CSS3绘制弹球动画效果
  • 原文地址:https://www.cnblogs.com/simba-lkj/p/6032458.html
Copyright © 2011-2022 走看看