We Keep Coding

Adding a value at the end of an iframe's src

in my website I use flipbooks made with Flip PDF Professional (here's an example: https://istitutometacultura.org/progetto_babar/storie_di_babar/il_ritorno_a_casa_di_babar/microstoria.html), and I embed them into the pages using iframes (example of parent page with embedded flipbook: https://edumediateca.istitutometacultura.org/il-ritorno-a-casa-di-babar2/). These flipbooks also have the function of opening directly to a specific page, if you add "#p=X" to the end (X is the page number). Now, sometimes I need to link a specific page of the flipbook, so the flipbook link will be, for example, "https://istitutometacultura.org/progetto_babar/storie_di_babar/il_ritorno_a_casa_di_babar/microstoria.html#p=5", but this will take me to the html page, and I want the user to be taken to the page with the iframe (https://edumediateca.istitutometacultura.org/il-ritorno-a-casa-di-babar2/), not to the html file.
Since I don't want to duplicate the page just to add "#p=5" to the iframe's src, is there a way to add a value to the end of the src maybe putting it into the parent page url? (for example, if the url is https://edumediateca.istitutometacultura.org/il-ritorno-a-casa-di-babar2#p=5 the iframe's src will change from "......html" to "......html#p=5"). I don't know what to do, I really need this mechanism to work in order to publish my services... Something in Javascript or C#?

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 remove all javascript from an html string (with javascript or jquery)?

I want to display html provided by a user in a page. My page is almost entirely dynamic (JS code), and I was wondering if there's an easy way to sanitize it?
Like, maybe I could remove all the <script> and <iframe> tags and unbind all the events contained in the string (or remove any html attribute starting by 'on') in order to not have any javascript code from the string possibly executed?
Can the users possibly insert javascript with a css 'content' property in a style attribute?
The jquery $(...).text(...) function doesn't help me, since I want to preserve any html mark-up or css styling.
If there's no easy solution i'm ready to live with a whitelist of html tags (table span div img a b u i strong...), but i'd rather not have to white-list the attributes too.

The more foolproof way to show user content safely is to embed it in an iframe who's origin is a different domain than your host web page. This is what jsFiddle does. The main page is served from jsfiddle.net, but the user scripts are served from fiddle.jshell.net. This lets the user content do what it would normally do, but the browser's cross-origin protection keeps the user content from messing with the host page or domain or cookies, etc....
Trying to strip all possible places that scripts could be in the content is a risky proposition which you will probably forever be chasing new attack vectors. I'd personally much rather let the browser be in that business and put the user content on a different domain. Plus, allowing the user content to have it's normal JS will also let it work as desired.

getting dynamically content height of iframe by javascript

first i did my research on this topic after reading and applying so many JS i posting this problem,
i am trying to apply iframe in which i get content from some other domain.
i m trying to set the iframe height on the base of scrollheight of the content inside the iframe but failed to do so
i tried to use onload event of iframe but failed...
please help me i need to set the height of iframe dynamically by any mean necessary ..
if the code would be provided in Javascript that would be helpful to me
Thanks in advance

For security reasons, it is not possible to interact with a frame in a different domain.
That includes measuring its content.

#SLaks is correct. If the iframe content is on a different domain you cannot access its contents directly.
What you could do (and what I recently just did) is setup a proxy that pulls the content in via cURL (in php but im sure whatever server side language has something that is the equivalent). The iframe content is then on the same page and you can access the height of it via:
var _iframeHeight = $('#iframe').contents().find('body').height();
$('#iframe').height(_iframeHeight);
Also I forgot to mention (#SLaks thanks for the reminder) You would have to check all the script/style/image tags and check/add an absolute url to it. The proxy can get pretty tricky but it will get it done.

If you are able to alter the content inside the iframe, for example if you are the author or can contact the author of that iframe content, you can setup a double-iframe trick to send the height of the iframe to your main page.
Here is how that can be accomplished:
In your main page (AAA.com/mainpage.htm) you put an iframe (BBB.com/mainframe.htm).
Together with your main page, you create another page (AAA.com/heightproxy.htm)
You make that BBB.com/mainframe.htm would create an invisible iframe with AAA.com/heightproxy.htm inside.
Result: BBB.com/mainframe.htm on it's onload event can load it's iframe AAA.com/heightproxy.htm with some parameters added to URL. For example, it can put it's new height/width there into the parameters. Also, AAA.com/heightproxy.htm can access all JS function in AAA.com/mainpage.htm - as they are in same browser window and share same domain. This way it can redirect the width and height it received to the mainpage.
Disclaimer: This trick is only possible if you can modify the source of the iframe you need to include.

You cannot interact main page from iFrame if content is loaded from different URL (you can measure height from iframe, but cannot pass it to main page).
That can be overridden by loading content via simple proxy script.

how to extract the value of a field in an iframe into the main page

I have an iframe inserted into my main page.
The iframe generates a value which is of the type hidden
I need to extract this value into my main page using a javascript
Can someone please help me with this?

If the page that you load in the iframe is in the same domain of your main page, you can access the DOM of that page with:
window.frames[iframeName].document
and than it's very easy to get the value of any element.

You can access the contents of the iframe from the parent page the following way:
var iframe = document.getElementById("iframeId");
var field = iframe.contentWindow.document.getElementById("hiddenFieldId");
I didn't test it and it's been a while since I've used raw DOM in JavaScript so let me know if it does not work.

If the url of the iframe is to a different domain then you might need to make sure the domain of the document in the iframe is the same as the domain of the containing document.
Run this code in both documents before trying to read the values of the field:
document.domain = "example.com";
If the content of the iframe belongs to a different site than yours, then you do not have access to it with javascript. This is a security measure.

Use this
fram.document.getElementById("name").value
Sure it will work
Details :
fram = id given to the frame
name = id given to the text box inside the frame

If your page and the iframe content come from different domains, this will be quite tricky. I was recently forced to find a workaround for this and managed pull it off with an AJAX call to a PHP script utilizing file_get_contents() but it is not very copyright compliant or secure...