Develop Reference

Parsing iframe HTML code to get just the src attribute

I want to be able to take Iframe HTML code like the following...
<iframe src="https://example.com" width="100" height="100"></iframe>
and from it just get the src attribute: https://example.com
I will need to get the src attribute in javascript.
I have tried doing the following:
var iframeCode = `<iframe src="https://example.com" width="100" height="100"></iframe>`
document.getElementById("tmpElement").outerHTML = iframeCode
var src = document.getElementById("tmpElement").childNodes[0].src
It works, but there is a security flaw with this approach. If the page I set in the iframe code contains javascript, it would execute. While this is normal behaviour, I need help to find a solution which will either not execute the javascript or get the src without loading the iframe (this may be possible with regex, possibly?, but I am no expert at regex.)
Thank you in advance.

You could use DOMParser, which can turn an HTML string into a document without any possibility of executing unsafe code (like scripts or inline handlers):
const str = '<iframe src="https://example.com" width="100" height="100"></iframe>';
const doc = new DOMParser().parseFromString(str, 'text/html');
console.log(doc.body.children[0].src);

Node JS Get all iframes from url

I have a static webpage which I can't change and I need to get all iframes on this page. The iframes have no id's or name. They look like this
<iframe height="584" width="630" src="someurl" scrolling="auto" noresize="" frameborder="0"></iframe>
So, I can get the "main page" content with the module request but I don't know how to loop through it and find all iframe elements and their sources!
Hope you can help,
dunklesToast

The node module called cheerio is a node-like jQuery alternative. You can load your content of the "main page" and then get all the iframes like this:
var cheerio = require('cheerio')
var $ = cheerio.load(mainPageContent);
$('iframe').each(function(index, element) {
var url = $(element).attr('src'); // --> Get the URL of the iframe
// Do something with the URL of the iframe here
});

render partial view inside an iframe within asp.net mvc application

I have a asp.net mvc application in which I have a partial view named _GeoApi.cshtml.
I need to render it inside an iframe.
<iframe src='#{Html.RenderPartial("_GeoApi");}' id='fram' ></iframe>
I get a generated html code :
<iframe<script src="/Scripts/External js/jquery-1.8.2.js">
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBCVSBoBAUjAfb-Pfx_qq0ZKUHCitbzsl4&libraries=places&callback=initAutocomplete" async="" defer=""></script>
//content removed for brivety
src='' id='fram' />
</iframe<script>
So I need to know
What are the reasons of this error?
How can I fix my code?

Error is caused because you have a <script> tag in your <iframe> tag.
The solution is to simply provide a URL as the src to a URL where you would render the partial instead of trying to put the contents in the iframe tag.
<iframe src='/api/geoApi' id='fram' ></iframe>
Then create an ApiController that has a GeoApi action method which renders the "_GeoApi" partial view.

Refresh iframe?

I have an iframe on my page where you can checkout my latest web development pages, and so on. Is it possible to refresh it with regular JavaScript or jQuery?
<iframe src="projektit" style="width:100%; height:400px; border:none;" id="iframe"></iframe>
I'm thinking about something like this.
$.ajax({
url: "../",
success: function (data) {
$("#iframe").html(data);
}
});
Any ideas?

<iframe id="homepage" frameborder="1" width="400" height="300" src="http://jbcurtin.com/"></frame>
<script>
var frame=$("#homepage")
frame.attr('src',frame.attr('src'))
// None jquery:
var frame=document.getElementById('homepage')
frame.src=frame.src;
</script>
http://jsfiddle.net/ekpAm/

jsFiddle
To refresh an iframe I would suggest just changing the src value.
Changing the src value will trigger the iframe to refresh.
$('#iframe').prop('src', url);
If you notice it's not refreshing, you could always attach a bogus query string value to the end of the url in the case of it being cached.
var q = new Date(); // use current date obj as query string value
$('#iframe').prop('src', url + '?q=' + q.getTime());

Open iframe page in parent frame (javascript)

I'm sure someone in the know has a solution to this problem I'm facing? I have a site with Index.html which contains an Iframe. In this iframe, all pages of the site are shown...Home.html..Info.html...Contact.html..etc.
I'd like a javascript function so that when you open Home.html via the google sitemap for example, it shows up in the parent frame in Index.html. The function I currently have in the head section of each child page is:
<script>
if (parent.location.href == self.location.href){
window.location.href = 'index.html'
}
</script>
Although this works, it doesn't remember the child page and opens the Index page with the default iframe page...Home.html as the iframe is coded like this:
<iframe id="iframe" src="home.html" allowTransparency="true" id="iframeID" name="iframeID" width="100" height="100" scrolling="no" frameborder="no">
</iframe>
Has anybody a solution to this problem, as I've searched everywhere? Thanks.

Try to set location.href with a query string, i.e.:
// .getAttribute so we don't get the absolute URL
var src = document.getElementById("iframe").getAttribute("src");
if (parent.location.href === self.location.href)
location.href = "index.html?" + escape(src);
In index.html create a check for query strings and set the iframe source accordingly:
if (location.search)
document.getElementById("iframe").src =
unescape(location.search.substring(1));