Is there a way to embed a class from another page in my site?
Lets say I have this code in the page "index.html"
<div class="cls1">
content of div...
</div>
and I want to embed it to another page "anotherpage.html" in my site.
So I do:
<iframe src"?"></iframe>
What should i put instead the ?
note
I want to take from the first file only a divs with the same class
You can separate your html to two files, and then add iframe to another file.
First file:
<div class="something">
Tralala
</div>
Second File:
<iframe src="/path/to/your/first/file.html">
</iframe>
iframe requires src (source) parameter, which should be a valid URL where html file lays. However you can use javascript to assume this type of behaviour.
Using jquery for example:
$('.div2').html($('.div1').html());
Related
How can I get html-code of a webpage from an angular directive?
in my example I have an html code:
<div class="modal-body" data-ng-bind-html="myHTML">
</div>
I want to place inside the div the content of another page! In my directive I do something like:
$rootScope.myHTML = link;
Where link should contains the whole html of the page! If myHtml="http://www.google.com", how can I retrieve the content of 'link'?
It sounds like you really just want to apply the external site inside your view, and then you should just link it in an iframe.
<iframe src="http://www.google.com"></iframe>
you can directly insert all the html of directive in html it self only. In your parent html you can insert directive.html like
<directive></directive>
i use object tag for pdf
<h2>Object</h2>
<div id="div3">
<object data="abc.pdf" height="300" width="500"><p>not supported by object</p></object>
</div>
i tried to
var position = document.getElementById('elemId').scrollTop;
but it does not work because i write it into my html page.object tag makes a separate page in which it uses chrome API. My script is in main page not in object auto-generated page.Any Solution ?This is image when i right click on object PDFenter image description here
I have a link (A link), which dynamically creates some html content into the page by a js file placed in the head content. This works well.
<head>
<script src="my.js">
</head>
<body>
<div>
<a href="A link">
</div>
</body>
Than clicked the A link, and this is created:
<div>
<a href="B link">
</div>
The newly created html content also contains a link (B link), which should use the same js file, as used before, but it seems, that the B link cannot see it, however the js file is still in the header content.
Works only if I put the js file in a script tag to the end of the dynamically created html content generated by A link, like this.
<div>
<a href="B link">
<script src="my.js">
</div>
But this means I load this js file twice. What am I missing here?
Thanks.
If you want the newly created element to perform some action then you should use this technique using jquery.
$(document).on('click', '.linkclass', function()
{
// Perform your action here.
alert('I was clicked');
});
live of Jquery is now obselete and is better to use on. In this way your all newly created element or already created elements having class as .linkclass will perform alert(); action. Hope it helps.
I have a webpage that has several <div> sections ("navcol" and "maincol"). The "navcol" div contains <object data="mypage.html">. Inside mypage.html there are buttons the user can click to select pages to be inserted into "maincol". I need to gain access to the innerHTML of "maincol" in the main page with Javascript, so I can do the insertion (like using an iframe). Can someone put me on the right track?
PS. I am using <object>, because I want to have HTML 4.0 "Strict" and Iframes are not in "Strict", but s are.
From within the page in the object element, you can get access to the upper–most browsing context using:
window.top.document
so you can try:
window.top.document.getElementById('maincol');
no doubt only within limitations imposed by the same–origin policy though.
e.g.
<div id="mailcol">maincol</div>
<div id="navcol">
<object data="foo.html"></object>
</div>
in foo.html:
<button onclick="
alert(window.top.document.getElementById('mailcol').innerHTML)
">button</button>
I have two applications one is already built and the other one is my own I can't do any modification in the first one and it uses iframes and in that frame I can put my application but I will need the name of the connected users which the only option is to get it from the source code using javascript the problem is that user name inside a css class not id
if you have any ideas how can I get it please help thanks to you all
<div class="Entete_User">
<div class="Entete_UserName">USER NAME <br> USER CITY</div>
</div>
<div class="body">
<iframe id="myiframe" frameborder="0" allowTransparency="allowTransparency" src="MYPAGE.aspx"></iframe>
</div>
</form>
To get the content of the element in the parent window from inside the iFrame :
window.parent.document.getElementsByClassName('Entete_UserName')[0].innerHTML;
Try this but make sure Iframe and your origin page in same domain as iframe does not support cross domain
JavaScript
window.parent.document.getElementById('parentElement')[0].innerHTML;;
Jquery
$('#parentElement', window.parent.document);
this is for outside the iframe trying to see whats inside..
document.getElementById("myiframe").contentWindow.document.getElementById()
but you have to be on the same domain