Question

我正在使用object标签在html页面中加载html片段。

我的代码看起来像这样：

<html><object data="/html_template"></object></html>

在加载页面后，正如预期的那样，在对象标记之间添加了一些元素。我想获得这些元素，但我似乎无法访问它们。

我尝试了以下内容 $("object").html() $("object").children() $("object")[0].innerHTML

这些似乎都不起作用。有另一种方法可以获得这些元素吗？

编辑：

更详细的例子：

考虑这个

<html><object data="http://www.YouTube.com/v/GGT8ZCTBoBA?fs=1&hl=en_US"></object></html>

如果我尝试在对象中获取html，我会得到一个空字符串。

http://jsfiddle.net/wwrbJ/1/

Answer 1

只要您将其放在同一个域中，就可以执行以下操作：

HTML

<html>
    <object id="t" data="/html_template" type="text/html">
    </object>
</html>

的JavaScript

var t=document.querySelector("#t");
var htmlDocument= t.contentDocument;

Answer 2

innerHTML将提供对<object>和</object>之间的html的访问权限。问的是如何在窗口/框架内生成对象加载的html（它与open和close标签之间的代码无关）。

我也在寻找答案，我担心没有。如果我找到一个，我会回来发布它，但我现在很长一段时间都在寻找（并不孤单）。

Answer 3

不，不可能访问跨源框架！

Answer 4

试试这个：

// wait until object loads
$('object').load(function() {
    // find the element needed
    page = $('object').contents().find('div');
    // alert to check
    alert(page.html());
});

Answer 5

这里有一段可行的代码示例。不确定您的代码有什么问题。

<html>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 <script type="text/javascript">
    $(document).ready(function(){
            var k = $("object")[0].innerHTML;
            alert(k);
            $("object")[0].innerHTML = "testing";
        });
 </script>
<object data="/html_template">hi</object>
</html>

Answer 6

一旦完全加载并且属于同一个域，您可以使用以下代码读取对象数据：

HTML -

<html>
<div class="main">
<object data="/html_template">
</object>
</div>
</html>

Jquery的 -

$('.main object').load(function() {
    var obj = $('.main object')[0].contentDocument.children;
    console.log(obj);
});

希望这有帮助！

Answer 7

我知道这是一个老问题，但是这里......

我在个人网站上使用它并最终在一些工作项目中实现它，但这就是我如何挂钩svg的dom。请注意，您需要在加载对象标记后运行它（因此您可以使用onload函数触发它）。它可能需要适应非svg元素。

function hooksvg(elementID) { //Hook in the contentDocument of the svg so we can fire its internal scripts
   var svgdoc, svgwin, returnvalue = false;
   var object = (typeof elementID === 'string' ? document.getElementById(elementID) : elementID);
   if (object && object.contentDocument) {
      svgdoc = object.contentDocument;
   }
   else {
      if (typeof object.getSVGDocument == _f) {
         try {
            svgdoc = object.getSVGDocument();
         } catch (exception) {
            //console.log('Neither the HTMLObjectElement nor the GetSVGDocument interface are implemented');
         }
      }
   }
   if (svgdoc && svgdoc.defaultView) {
      svgwin = svgdoc.defaultView;
   }
   else if (object.window) {
      svgwin = object.window;
   }
   else {
      if (typeof object.getWindow == _f) {
         try {
            svgwin = object.getWindow();//TODO look at fixing this 
         }
         catch (exception) {
            // console.log('The DocumentView interface is not supported\r\n Non-W3C methods of obtaining "window" also failed');
         }
      }
   }
   //console.log('svgdoc is ' + svgdoc + ' and svgwin is ' + svgwin);
   if (typeof svgwin === _u || typeof svgwin === null) {
      returnvalue = null;
   } else {
      returnvalue = svgwin;
   }
   return returnvalue;
};

如果你想从svg的dom中获取符号元素，你的onload函数可能如下所示：

function loadedsvg(){
   var svg = hooksvg('mysvgid');
   var symbols = svg.document.getElementsByTagName('symbol');
}

Answer 8

<强>已更新

我使用这行Javascript来更改iFrame中输入字段的值，

document.getElementById('iframeID').contentWindow.document.getElementById('inputID').value = 'Your Value';

参考： https://stackoverflow.com/a/14451440/3452102

如何从对象标签中获取html元素？

8 个答案: