Empty contents of a iframe without touching the src - javascript

I would like to Empty contents of a iframe without touching the src. Probably using jquery. Say some thing like setting the innerHTML of body inside iframe to &nbsp
I have tried the following and it didnt work
$("#Top iframe body").html(' ');

If the iframe is on a different domain, its contents are off-limits to your page. There's nothing you can do about that - except remove or hide the whole container... or change the src.
If it is on the same domain, you can do it but the syntax is different - use .contents().

Related

change css element inside iframe

i have one probleme with iframe in my website i can't change css of some element inside the iframe. this the html of iframe when i inspect code via chrome.
i want to change the value of div under div class with class width-100.
i already try a lot of code without success.
i found this solution but i dont understand
/*******/
CSS is only scoped within the same document. An iframe is an entire document in its own right, and so a CSS rule that applies to the page that contains that iframe cannot apply to the page that's within that iframe.
This means that as far as HTML and CSS are concerned, html is always :root (and therefore can never be :not(:root)).
Unless you are able to transfer this CSS from the containing page to the page within the iframe (using a script for example), I don't believe there is a way using just CSS.
Css–selector for when a html-document is inside an iframe?
/*******/
Try it.
$('iframe').contents().find("width-100 div").css('height', '200px');

What are the differences between iframe and innerHTML

I was doing an innerHTML on a div element. MY lead comes and tells me that innerHTML and iFrame are both the same. Now this one was something new. I always thought InnerHTML to be different from iFrame.
[My lead]: "The issue is because he is trying to use innerHTML which
in turn is called as IFRAME for a browser"
I wanted to know the differences between an iFrame and innerHTML. Are they both essentially similar in nature? I looked but couldn't find much.
Thanks
Sounds like a communication error--e.g., if your lead means that the innerHTML of that div is just going to show an iframe as its innerHTML (or otherwise, it would sound like you need a new lead). innerHTML grabs the HTML code as a string inside of the selected element. An iframe is an element used for transcluding content (usually from other sites or other pages on your own site). Apples and oranges...
They're very different. An iframe tells the browser to load a different URL in the iframe, and it will often have it's own scrolls. But a div can be made to look and work like an iframe by setting
overflow: auto
- in the style. Maybe that's what he meant.
iframe is an HTML tag used for displaying another website or page on your page, innerHTML is used in Javascript to change the content of an element on your webpage.
They are completely different.
They are not the same. Innerhtml is a way to access the contained html of an html element. An iframe is an element that let's you display content from a different web page than the one you're currently on.

How to change the iframe content by changing the select option

I have a select box and a iframe. when I change the select option the content in the iframe needs to change. I used jquery to change the iframe src.
To change the src I have used the following code. It works,If I see in the view source I can see the change of src value.But the content is not changing in the iframe.
$('#myframe').attr('src', "http://www.option"+value+".html");
Question: How to make this new src url to load my iframe?
You shouldn't use this tactic (there are various issues with it, IE dislikes blank srcs for example).
Instead, remove and recreate a new iframe with the new src.
$('#myframe')
.before('<iframe src="blah.htm"></iframe>')
.remove();

replace style with jquery on div within iframe crossdomain

I've an iframe with code that looks like this:
iframe#someID
html
head
body
first div
iframe points to file on the other domain. I want to replace styling of the div, effectively putting background-color:transparent; instead of color it already has.
Is this possible?
No, cross-site-manipulation is fortunately not possible.
To change the contents of an iframe on the same domain, however, have a look at this: http://api.jquery.com/contents/#example-1

javascript - get data from an element within an iframe

I've got this <iFrame> [name="data"] with a page displaying a <span>, with id="weergave_percentage".
I want to get the numbers from that span into a javascript function.
I currently made this, but it returns: null
var percentage = window.frames['data'].document.getElementById('weergave_percentage');
alert(percentage);
What am I doing wrong and how can I do what I want?
Note: the span containing the data, only contains numbers (float), and no other HTML formatting of any kind.
Also, I've put the piece of javascript after the code for the iFrame, to make sure the iFrame is loaded when I try to get the data from the iFrame.
Also, the iFrame's src is on the same domain as the main page.
If iframe src links to other domain than the one your pages is displayed from - then you can't get that data (browsers prevernt cross-site scripting).
Other than that - this could should work:
$('iframe').contents().find('#weergave_percentage').html();

Categories