Selecting an element in iframe with jQuery
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.
How can I access the contents of an iframe with JavaScript/jQuery?
I think what you are doing is subject to the same origin policy. This should be the reason why you are getting permission denied type errors.
how to select an iframe from itself with jquery
If you have only one iFrame on your site it's easy. Just use this selector
$('iframe', parent.document)
If you have more then one it gets more complicated. iFrame document doesn't have a clue in which of the main page iframes it was loaded so there is no easy way of selecting parent iframe with the selector. If you however know the parent id, name, class or even iframe source url you can use that information to modify the selector above to only match iframe that you want. You could also match a iframe you need if you know its index on the main page.
// iframe with MyClass class
$('iframe.MyClass', parent.document);
// iframe with MyId id
$('iframe#MyId', parent.document);
// even better since id is unique
$('#MyId', parent.document);
// iframe with myname name
$('iframe[name=myname]', parent.document);
// iframe with specific src
$('iframe[src=/path/to/iframe/source]', parent.document);
// second iframe (index is starting from 0)
$('iframe:eq(1)', parent.document);
jquery select iframe children
$("iframe").contents().find("textarea").keydown(...)
Get element from within an iFrame
var iframe = document.getElementById('iframeId');
var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;
You could more simply write:
var iframe = document.getElementById('iframeId');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
and the first valid inner doc will be returned.
Once you get the inner doc, you can just access its internals the same way as you would access any element on your current page. (innerDoc.getElementById
...etc.)
IMPORTANT: Make sure that the iframe is on the same domain, otherwise you can't get access to its internals. That would be cross-site scripting. Reference:
- MDN:
<iframe>
Scripting - MDN: Same-Origin Policy: Cross-Origin Script API Access
Related Topics
Using Jquery to Find an Element at a Particular Position
How to Get Url Parameters with JavaScript
Where to Save a Jwt in a Browser-Based Application and How to Use It
What Is "Callback Hell" and How and Why Does Rx Solve It
Indirect Function Call in JavaScript
Use $Http Inside Custom Provider in App Config, Angular.Js
How to Test If a String Is JSON or Not
Which Browsers Support Import and Export Syntax for Ecmascript 6
Differencebetween Parseint(String) and Number(String) in JavaScript
What Are the Current Cookie Limits in Modern Browsers
Is Onload Equal to Readystate==4 in Xmlhttprequest
Jquery - Get Text for Element Without Children Text
Node.Js: Read a Text File into an Array. (Each Line an Item in the Array.)
Normalizing Mousewheel Speed Across Browsers
Utf-8 Word Boundary Regex in JavaScript
Amazon S3 Direct File Upload from Client Browser - Private Key Disclosure