jQuery：查找元素，无论框架如何

Question

我们的开发网站和公司网站的框架层次结构略有不同。

偶尔我需要引用不同框架中的元素。

不幸的是，我不知道该框架在层次结构中的位置。不过我知道它是 id。

当我不知道确切的结构时，如何找到框架或特定元素？

澄清一下 在开发中，它基本上只是一个页面，包含一个框架。我在框架的上下文中，只是使用 window.top.document 来获取我想要的文档。

在产品中，嵌套是不同的，window.top.document 不起作用，因为它位于其他两个框架内。

我无法更改此结构，这就是我们的应用程序门户的工作方式。

Answer 1

如果 iframe 来自同一个域，则可以通过 jQuery 轻松访问元素，因为

$("#frameID").contents().find("#elementID").hide();

关于外部域有一些例外 这里 :

Answer 2

也许你可以尝试遍历所有框架。您将需要使用广度优先或深度优先搜索，具体取决于框架嵌套的深度。最初将根传递给它。

frameSearch(yourElementId,$("frame"));

function frameSearch(elementId,frames){
      if (!(frames)) {return "element not found";}
      $.each(frames,function(){
           var $elementFound = this.find("#"+elementId);
           if ($elementFound){
               return $elementFound;
           }
           var newFrames = this.find("frame");
           if (newFrames) {frameSearch(elementId,newFrames);}
      });
}

我不能 100% 确定这个递归算法的正确性，但我相信这是正确的想法。

编辑：

如果您需要找到最顶层的父级，请尝试：

 var $currentDocument = $("document");
    while ($currentDocument.parent()){
         if ($currentDocument.find("#"+yourElementId)){
              $yourElement = $currentDocument.find("#"+yourElementId);
              break;
         }
         $currentDocument = $currentDocument.parent();
    }

    if (!($yourELement)){
        $yourElement = frameSearch(yourElementId,$("frame"));
    }

这将首先向上检查，如果不起作用则向下检查

Answer 3

如果您知道框架的 id，则可以使用 id 选择器和 contents() 方法来查找 iframe 中的元素。试试这个

$("#iframeId").contents().find("elementToFind")

Answer 4

这对我有用......

USERNAME='input#username';

    frame_count=window.parent.frames.length;
    for(f=0;f<frame_count-1;f++){
        test_frame=window.parent.frames[f].document.body;
        if ( $(USERNAME, test_frame).length==1 ) {
            INPUT_FRAME=f;
            break;
        };
    };

detail_frame=window.parent.frames[INPUT_FRAME].document.body;

$(USERNAME, detail_frame).val(username);