Access to DOM in <object> with jQuery

Question

I have this code on jsfiddle.

HTML:

<object type="text/html" data="http://www.w3.org/" style="width:100%; height:100%;position: absolute;bottom: 0;"></object>

JS:

console.log($('object').find('*').length);

In tag there is strange #document tag and I can't find any tag in there Console says, that there are zero elements.

How can I read from DOM in <object>? What is #document in <object>?

Quentin · Accepted Answer · 2013-07-15 14:00:14Z

8

Don't use <object> elements to load HTML documents. Use <iframe>s instead - the support and APIs are better.

Then you can use

var frame_contents = $('iframe').contents(); 
console.log($(frame_contents).find("*").length);

… subject to the usual cross origin security restrictions if you load a document from a different origin.

answered Jul 15, 2013 at 14:00

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1