I have a web page that contain an iframe:
<div id="confIMG" style="display:block;">
<iframe id="ifrmy" src="http://www.example.com" style="margin:0;padding:0;border:0;overflow:hidden;height:200px;width:90%;'" scrolling="no">
</iframe>
#document
<!DOCTYPE html>
<html>
<head>....</head>
<body>....</body>
</html>
</div>
for getting all of html source, i used this javascript:
javascript:HTMLOUT.processHTML(document.documentElement.outerHTML);
But, when the listener is invoked, i just see:
<div id="confIMG" style="display:block;">
<iframe id="ifrmy" src="http://www.example.com" style="margin:0;padding:0;border:0;overflow:hidden;height:200px;width:90%;'" scrolling="no">
</iframe>
</div>
the issue is that all iframe document is missed. How can i get them all?
I also tried to get the page using JSOUP. in that case, i'm only get:
<div id="confIMG" style="display:block;"></div>
PS: i tried to check using Chrome browser. I can only see source code when i use developer options / developers tools into tab elements.
JSoup won't fetch automatically the iframe content if you don't ask it to do so.
When you have first loaded the page, find the iframe then fetch it with Jsoup.
Document doc=...
Element ifrmy = doc.select("#ifrmy").first();
if (ifrmy!=null) {
Document iframeContent = Jsoup.connect(ifrmy.attr("src")).get();
// ...
}
Related
I'm buildin a webserver for an embedded system.
The main page must embed another html file, whose address in created with javascript.
the javascript is the following
<body class="mainPage" onload="getTerminalUrl()"> <br>
<script>
function getTerminalUrl() {
var terminalUrl = "embedded.html"
document.getElementById("embeddedTerm").setAttribute("src", terminalUrl);
document.getElementById("linkedTerm").setAttribute("action", terminalUrl);
}
</script>
and it creates a link to embedded.html (just for this example), in two spots
a button:
<form id="linkedTerm" action="">
and an embedded form
<embed id="embeddedTerm" src="" style="width: 100%;">
The embedded page is like this
<!DOCTYPE html>
<html>
<body style="background-color:powderblue;">
<h1>Heading</h1>
<p>paragraph</p>
</body>
</html>
What happens is that, by using Firefox, i get the expected result
With Chrome i get the embedded page only when i open the inspector or resize the window
Do i Have to force a redraw or something to have the embedded page displayed consistently?
If instead of the Javascript i hardcode the URL everything works.
Thanks,
Marco
#CBroe posted the correct answer.
using iframe
<iframe id="embeddedTerm" src="" style="width: 100%;">
as well as forcing a refresh with
var element = document.getElementById("embeddedTerm");
element.style.display = 'none';
element.style.display = 'block';
Thanks a lot
I must check the change of a tag in an iframe in another webpage (with the same domain). I have this index.html:
<html>
<body>
<iframe id="open_app" src="/sign.php" width="800" height="600" frameBorder="0" scrolling="no" ></iframe>
</body>
...
and this is the tag in sign.php that I want check for change:
<div id="status"></div>
Now, I have always used the MutationObserver for check the change of a tag in a webpage but I now I can not do the same to test the iframe tag with the id status. I've already seen all the related discussions on Stackoverflow but nothing works. What is the best way to verify the change of the iframe tag with the MutationObserver? Thanks.
I've been struggling with this one for a few hours now.
I am trying to attach click listeners to elements within an iframe with no src attribute. The entire page is basically inside that bad boy.
When I use "inspect element", the body of iframe looks empty (dunno if that has to do with the fact it has no src attribute.
<iframe id="CoverIframe" name="CoverIframe">
#document
<html>
<head></head>
<body></body>
</html>
</iframe>
When I enter the ID of the iframe in the console, it simply returns null, which prevents me from checking the elements it contains via contents().find() or anything else for that matter. I can only see its content (and by extension the elements on the page) by showing the source code (right click>see source).
Any thoughts on this? Is it because of the absence of src attribute? Any way I can get around it?
Thanks,
Alexis
As you noticed, you can't just set the innerDocument of an iframe like that.
However, you can use its (html-5 only)srcDoc attribute to set it,
<iframe id="CoverIframe" name="CoverIframe" srcdoc="
<html>
<head></head>
<body>hello</body>
</html>"
></iframe>
or use a data:text/html;charset=utf-8,<html><head></head><body>hello</body></html>".
<iframe id="CoverIframe" name="CoverIframe" src="data:text/html;charset=utf-8,<html>
<head></head>
<body>hello</body>
</html>"
></iframe>
But for the later, you will soon need to encodeURI() your page.
So the best is probably using javascript :
<script>
var yourHTML = "<html><head></head><body>hello</body></html>";
function loadFrame(e){e.contentDocument.write(yourHTML)};
</script>
<iframe id="CoverIframe" name="CoverIframe" onload="loadFrame(this)">
► Show code fiddle
*Im trying to Open multiple links in same Iframe, as well as changing the divsstyle.visibility(Visibility is working for me) but adding window.open I get nothing. I have the original address in a div id="testing" name="wordp" *
<head>
<script type="text/javascript">
function wordpaboutme() {
var showme2 = document.getElementById("testing");
showme2.style.visibility = "visible";
var changeme = document.getElementById("testing");
changeme.window.open.('http://mysite.com/main/about-me/','wordp');
}
</script>
<body>
<div id="testing" name="wordp" class="bloger" ><iframe src="http://mysite.com/main/" frameborder="0" scrolling="no" width="990" height="800" >
<p>Your browser does not support iframes.</p>
</iframe>
</div>
window.open opens a popup window. It doesn't change what's in an iframe.
To open a different page in an iframe, consider changing the "src" attribute of the iframe with JQuery
Also, as Collin Grady has mentioned in the comment, it is an even simpler method to specify the iframe id in the "target" attribute of the link, to do the job.
I have this simple html page I wish it to scroll automatically to bottom the iframe however the codesimply does not work, it does not scroll down the iframe automatically,
anyone knows whats wrong with it?
<html>
<head>
<script type="text/javascript">
function showLog() {
el = document.getElementById("log")
el.innerHTML='<iframe id="myLogFrame" name="mylog" onload="this.contentWindow.document.documentElement.scrollTop=100" src="http://yahoo.com" width="100%" height="50%" align="middle" scrolling="yes" frameborder="0"></iframe>'
el.scrollTop=el.scrollHeight
}
</script>
</head>
<body onload="showLog()"/>
test1
<div id="log" style="width:100%">
</div></body></html>
Sadly, what you're trying to do is impossible due to the Same Origin Policy which restricts any and all access to documents that are not on your domain.
Your only chance is if the remote page has an anchor to the bottom of the page. If it does, you can link to that anchor. The browser will jump there.
<iframe src="http://yahoo.com#name_of_bottom_anchor">
If your iframe is linked to another domain, web browser will blobk you access iframe's document, so you can access iframes scrollTop.