zoukankan      html  css  js  c++  java
  • jquery/js iframe 元素操作

    1.判断id/ class 是否存在?

    <script>
    $(function(){
        if(("#id_name").length()>0){
        //如果id 存在
        }
    })
    </script>

     2.jquery 判断 undefined

    <script>
    var exp = undefined;
    if (typeof(exp) == "undefined")
    {
        alert("undefined");
    }
    </script>

     3.jquery 获取iframe元素内容(父类窗口中获取iframe的内容)

    <script>
         //格式:
        $("#iframe的ID").contents().find("#iframe中的控件ID").click();//jquery 方法1 
        //实例:
        $("#ifm").contents().find("#btnOk").click();//jquery 方法1  
    </script>    
    
    父窗口中操作iframe:window.frames["iframeChild"].document //假如iframe的id为iframeChild
    • 父窗口中操作iframe:$(window.frames["iframeChild"].document) //假如iframe的id为iframeChild1 $(window.frames["iframeChild"].document).find("#child")

    4.在iframe中 获取iframe的父类元素

    <scritp>
        $('#父窗口中的元素ID', parent.document).click();
        $('#btnOk', parent.document).click();  
    </script>
    

     5.jquery 子元素 获取当前iframe的id

    <scritp>
    self.frameElement.getAttribute('id');
     window.frameElement.id ;//jquery 子元素 获取当前iframe的id
    </script>
    

     6.jquer操作CSS

    <script>
     $(".rendering").children().eq(0).css("color","white");//css的操作 color:white
    </script>

    7.jquery 添加/移除clss

    注意:jQuery在操作class的时候,一定要循环取class,否则,默认是处理第一个元素

    <script>
    $(this).parent().addClass("am-in");//添加class为 “am-in”的class
    $(this).parent().removeClass("am-in");//移除class为 “am-in”的class </script>

    8.hover实现:

    <script>
    //鼠标移上去,移走的颜色 $(this).hover(function(){ $(this).children().eq(0).css("background-color","#0e90d2"); $(this).children().eq(0).css("color","#eee"); },function(){ $(this).children().eq(0).css("background-color","#ffffff"); $(this).children().eq(0).css("color","#6b6b6b"); }) </script>

     

    9.jquery 判断iframe是否加载完成

    $("#myFrameName").load(function () { //myFrameName iframe 的id
    	//加载完成
    	});
    

    10,在父页面判断子页面被点击:

     var iframe = document.getElementById('gislist');
    	    iframe.contentDocument.onclick = function () {
                iframe.contentWindow.parent.hideZKZ();
            };
    

    11.jquery 字符串分割

    var arr = 'sss@vvv'.split('@');
    此时 arr为数组;
     

    12.iframe自适应高度

    <iframe src='/hnsl/baseinf/gislist.do' id='gislist' style='min-height:600px;100%;' onload='this.contentWindow.document.body.scrollHeight'></iframe>
     

    13.当前页面 调用 iframe 的函数

    var x = $("iframe id")[0].contentWindow;
    x.functionName()
    

    14.iframe 调用 父页面的 Js 变量;

    parent.method
    
    parent.variable
    

     15.select 默认显示

    http://www.cnblogs.com/colaman/p/9719681.html

    16.获取iframe中的js变量tree:

    1 var tree = document.getElementById('projectIframe').contentWindow.tree;
    2 
    3 或者
    4 
    5 $("#divId").find("iframe")[0].contentWindow.tree;

    17.当前iframe 获取 兄弟iframe

    1  var iframe = window.parent.document.getElementById('monitor');//monitor为兄弟iframe的id
    2     var b = iframe.contentWindow.document;
    3     var temperature = b.getElementById("Temperature");
    4     b.getElementById("jkxxTabs");

    用iframe嵌套页面时,如果父页面要获取子页面里面的内容,可以使用contentWindow或者contentDocument,其区别如下:

      1、contentWindow  这是个只读属性,返回指定的iframe的窗口对象。它虽然不是标准的一部分,但各个主流浏览器都支持。

      2、contentDocument  Firefox 支持,IE6,IE7都不支持,IE8开始支持,需要如此访问 document.frames['J_mainframe'].document。

    18.在iframe本页面,要操作这个iframe的父页面的DOM元素(即嵌套这个iframe的页面)可以用:

      window.parent、window.top(这里的TOP是获取的顶层,即有多层嵌套iframe的时候使用)

     18.获取任意iframe的内容

     window.frame["frameID"].contentWindow;

    例如:iframe1(id:fram1) 中有iframe2, iframe2(id:fram2) 中有iframe3(id:fram3)

    要求 iframe4获取iframe3中的 input的值 ,该input的ID为 inputId

    window.frames["fram1"].contentWindow.$("#fram2")[0],contentWindow.$("#fram3")[0].find("inputId").val();


  • 相关阅读:
    【HDU】2295 Radar
    【SPOJ】1771 Yet Another NQueen Problem
    【HDU】2222 Keywords Search
    【HDU】3957 Street Fighter
    【HDU】3156 Repair Depots
    【HDU】4210 Sudominoku
    【HDU】3656 Fire station
    fusioncharts for flex3 对于charts 的一些样式:背景透明,背景插入图片等等 .
    FusionCharts参数的详细说明和功能特性
    ASP.NET AJAX入门系列
  • 原文地址:https://www.cnblogs.com/lixiuming521125/p/9744983.html
Copyright © 2011-2022 走看看