Get and print hash in iframe

Question

I Want to get hash from this url

http://www.mywebsite.com/#/aaaaaaaa

aaaaaaaa

And add to iframe :

<iframe src="http://www.example.com/url/aaaaaaaa" frameborder="0">

Javascript code :

<script>
var hhash = window.location.hash.substr(1);
alert(hhash);
</script>

And? What is wrong with the code you already have? I.e. what is your question? Also, you want to add the hash to the iframe, or rather to the src of the iframe? — Teemu, Oct 11 '17 at 07:55
yes , @Teemu i want to print "aaaaaaaa" automatically in iframe with javascript — ericdrey, Oct 11 '17 at 07:57
https://stackoverflow.com/questions/24603580/how-can-i-access-the-dom-elements-within-an-iframe Althought, it looks like you're misusing `location.hash`, maybe you should use a query string instead? — Teemu, Oct 11 '17 at 08:00
Thank you for your time @Teemu but i cant edit this code , I'm Beginner in javascript — ericdrey, Oct 11 '17 at 08:05

lumio · Answer 1 · 2017-10-11T08:14:27.763

0

Your title and question is a little bit misleading. If you just want to print the hash tag, you can create an element and set the innerText to your hash, like so:

// Use hash instead of href here! :) This is just to make the example work
const lastPart = window.location.href.split( '/' ).pop();
document.querySelector( '.hash' ).innerText = lastPart;

<div class="hash"></div>

If you want to alter the src of the iFrame, you could use the first example combined with setAttribute.

// Use hash instead of href here! :) This is just to make the example work
const lastPart = window.location.href.split( '/' ).pop();
const src = 'http://example.org/url/' + lastPart;
document.querySelector( '.hash' ).setAttribute( 'src', src );
document.querySelector( '.url' ).innerText = 'iframe points to ' + src;

<iframe class="hash"></iframe>
<div class="url"></div>

edited Oct 11 '17 at 08:14

answered Oct 11 '17 at 08:05

lumio

7,428
4
40
56

Thank you for your time , but i want just to print last folder http://www.mywebsite.com/#/aaaaaaaa .... "aaaaaaaa" in iframe like this – ericdrey Oct 11 '17 at 08:13
My second example should do exactly that – lumio Oct 11 '17 at 08:14
What does not work (any errors?) and what is your expected outcome? – lumio Oct 11 '17 at 08:19
Blank page , I cannot get "aaaaaaaa" in iframe – ericdrey Oct 11 '17 at 08:23
Ok so your real iframe also loads example.com? I thought the page you are loading already checks for the location. If you just want to show the hash on your page, you don't need to have an iframe. Just go with the first solution by adding a `
` :) Otherwise you need to explain a little more what you want exactly – lumio Oct 11 '17 at 08:28
Thank you very much for your detailed explanation Mr.lumio – ericdrey Oct 11 '17 at 08:38

Osama · Accepted Answer · 2017-10-11T08:43:08.913

0

You can also use the lastIndexOf() function to locate the last occurrence of the / character in your URL, then the substr() function to return the substring starting from that location:

 var hhash =(window.location.href.substr(window.location.href.lastIndexOf('/') + 1));
 document.write("<iframe src=\"example.com/url/\""+hhash+"frameborder=\"0\">");

edited Oct 11 '17 at 08:43

answered Oct 11 '17 at 08:13

Osama

2,912
1
12
15

Thank you @Osama , but i want to print var hhash .. "aaaaaaaa" in iframe like this – ericdrey Oct 11 '17 at 08:15
1

Thank you very much mr Osama – ericdrey Oct 11 '17 at 08:35
This won't write valid HTML. – lumio Oct 11 '17 at 08:40
It will only check the syntax of the document.write() line I use my iPhone not the laptop so may be an error there – Osama Oct 11 '17 at 08:41

score 0 · Answer 3 · answered Oct 11 '17 at 08:21

You can get hash part (without #/) with:

var hash = window.location.hash.replace('#/', '');

Then you get the current iframe src attribute with :

var src = document.getElementsById('YourIframeId').getAttribute('src');

And now you update the iframe src:

document.getElementsById('YourIframeId').setAttribute('src',src + '/' + hash);

Get and print hash in iframe

3 Answers3