如何获取元素的属性的两个内部框架内(How to get an attribute of eleme

<html>
  <head></head>
  <body>
    <iframe id="num1" src="/idk">
      <html>
        <head></head>
        <body>
          <iframe id="num2" src="/idk2">
            <html>
              <head></head>
              <body>
                <div id="div1">
                  <div id="div2">
                    <a href="http://www.blablabla.com"></a>
                  </div>
                </div>
              </body>
            </html>
          </iframe>
        </body>
      </html>
    </body>
    </html>

我的问题是 - 如何获得这两个Iframe和两个div JavaScript或jQuery的，我喜欢JS里面的一个标签的href属性。（比如： “http://www.blablabla.com”）。

Answer 1:

好了，让第一个iframe中是很容易。只是拍一个name上的属性<iframe>标记和使用window.frames['<name-of-your-iframe>']来获得它的window ，然后可以用于引用对象document是iframe的。似乎可以合理地预期document.getElementById('num1')应该返回同样的事情，但后者返回HTML元素，而前者的回报实际窗口对象，它是你的目的更加有用。

与嵌套iframe的问题是，因为你设置的src属性，我不认为你将能够获得访问那么容易。虽然你可以尝试使用这种方法相同。

希望这可以帮助。

Answer 2:

这可能是一个丑陋的解决方案，但至少它的工作原理，它实际上是相当简单：

// Create container to store iframes' inner HTML and to be able to work with it
var container = document.createElement("div");
// Add HTML of first iframe to container
container.innerHTML = document.querySelector("#num1").innerHTML;
// Add HTML of nested (second) iframe to container
container.innerHTML = container.querySelector("#num2").innerHTML;
// Finally get href attribute
var href = container.querySelector("#div2 a").getAttribute("href");
console.log(href);

大多数现代浏览器已经支持querySelector()你只能得到与老的IE问题。见http://caniuse.com/queryselector 。

编辑：此代码是基于以下想法：iframe的HTML内容和复制/其插入div元素，以便能够直接执行就可以了（查询，所以我们没有必要理会得到iframe的document对象）。当这已经与第一个iframe中完成，我们会重复第二（嵌套）iframe中。然后，我们可以简单地读出所需的元素的属性（一个或多个）。 querySelector()可用于几乎像一个jQuery选择器（如$("#id")

Answer 3:

var iframe1 = document.getElementById('num1');
var innerDoc1 = iframe1.contentDocument || iframe1.contentWindow.document;

var iframe2 = innerDoc1.getElementById('num2');
var innerDoc2 = iframe2.contentDocument || iframe2.contentWindow.document;

，最后你会得到

console.log(innerDoc2.getElementById('div2').getAttribute('href'));

* 这个简单的任务，没有必要框架

Answer 4:

尝试类似的东西：

var $iframe1 = jQuery('#num1');
var iframe1Content = $iframe1[0].contentDocument || $iframe1[0].contentWindow.document;
// see also: http://stackoverflow.com/questions/926916/how-to-get-the-bodys-content-of-an-iframe-in-javascript/11107977#11107977

var $iframe2 = jQuery('#num2', iframe1Content);
var iframe2Content = $iframe2[0].contentDocument || $iframe2[0].contentWindow.document;

var $link = jQuery('#div2 a', iframe2Content);
console.log($link);

jQuery的选择器法“的jQuery（”选择“上下文）” allowes你specifiy一个‘语境’。这意味着一个jQuery的元素，寻找中的“选择”。首先得到第一个iFrame的内容（contentDocument），并以此作为第二iFrame的选择范围内。

文章来源: How to get an attribute of element inside two iframes