Is it possible to parse tags in a html webpage which is shown in an iframe? I have tried to pile the code as follows, but it doesn't work.
<!DOCTYPE html>
<html>
<body>
<iframe id="Frame" src="Url"></iframe>
<button onclick="myFunction()">Parse it</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("Frame").src.getElementByTagName("title");
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
Is it possible to parse tags in a html webpage which is shown in an iframe? I have tried to pile the code as follows, but it doesn't work.
<!DOCTYPE html>
<html>
<body>
<iframe id="Frame" src="Url"></iframe>
<button onclick="myFunction()">Parse it</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementById("Frame").src.getElementByTagName("title");
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
Share
Improve this question
edited Mar 16, 2016 at 21:41
The Process
5,9533 gold badges32 silver badges41 bronze badges
asked Mar 16, 2016 at 21:40
jiten2015jiten2015
1973 silver badges11 bronze badges
4
- Check out this method api.jquery./contents – Rosmarine Popcorn Commented Mar 16, 2016 at 21:43
-
document.getElementById("Frame").contentWindow.document.getElementByTagName("title")
– dandavis Commented Mar 16, 2016 at 21:45 -
@dandavis Could
document.title
be substituted fordocument.getElementsByTagName("title")
? Missing "s" at "Elements" – guest271314 Commented Mar 16, 2016 at 21:51 - probably. that's another issue w/OP i forgot to harp on. good eye. what the code will show will not be the document's title, it will be a string version of the DOM object, which is yucky. – dandavis Commented Mar 16, 2016 at 21:53
1 Answer
Reset to default 4You can do something like the following. Just remember to change the src of your iframe to the url of the page you are actually loading:
<!DOCTYPE html>
<html>
<body>
<iframe id="Frame" src="sample.html"></iframe>
<button onclick="myFunction()">Parse it</button>
<p id="demo"></p>
<script>
function myFunction() {
var x;
//get the iframe object
var iframe = document.getElementById('Frame');
//cross browser solution to get the iframe document
//of the iframe
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
//if the document is not undefined
if (iframeDocument) {
//do something with the frames dom
//get the content of the title tag from the iframe
x = iframeDocument.getElementsByTagName("title")[0].innerHTML;
}
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
Note: This solution will not work on websites that do not allow cross origin loading in iframes. If you were to add the url http://www.google.
to the src of the iframe for example it would display the following error in the developer console.
Load denied by X-Frame-Options: https://www.google./?gws_rd=ssl does not permit cross-origin framing.
This is another error you may receive for the same reason. I recieved this error by trying it on by own website(bytewarestudios.).
Error: Permission denied to access property "document"