Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Selecting an element in iframe with jQuery

People also ask

How do I select an element in an iframe?

Getting the element in Iframeconst iframe = document. getElementById("myIframe"); Now, it has and contentWindow property which returns the document object by using that we can access the elements from an Iframe. const iWindow = iframe.

Can you access the content of an iframe?

The . contents() method can also be used to get the content document of an iframe, if the iframe is on the same domain as the main page.

How do I control content of iframe?

getElementById('myIFrame'); // Let's say that you want to access a button with the ID `'myButton'`, // you can access via the following code: const buttonInIFrame = iFrame. contentWindow. document. getElementById('myButton'); // If you need to call a function in the iframe, you can call it as follows: iFrame.

How do I check if an element is an iframe?

In short, to check if a page is in an iframe, you need to compare the object's location with the window object's parent location. If they are equal, then the page is not in an iframe; otherwise, a page is in an iframe.


var iframe = $('iframe'); // or some other selector to get the iframe
$('[tokenid=' + token + ']', iframe.contents()).addClass('border');

Also note that if the src of this iframe is pointing to a different domain, due to security reasons, you will not be able to access the contents of this iframe in javascript.


Take a look at this post: http://praveenbattula.blogspot.com/2009/09/access-iframe-content-using-jquery.html

$("#iframeID").contents().find("[tokenid=" + token + "]").html();

Place your selector in the find method.

This may not be possible however if the iframe is not coming from your server. Other posts talk about permission denied errors.

jQuery/JavaScript: accessing contents of an iframe


when your document is ready that doesn't mean that your iframe is ready too,
so you should listen to the iframe load event then access your contents:

$(function() {
    $("#my-iframe").bind("load",function(){
        $(this).contents().find("[tokenid=" + token + "]").html();
    });
});