We Keep Coding

how to set iframe height dynamically depending on its content

I want to set the iframe height depending on the content height, here below code is working for local links, but i want to do it on dynamically.
please help.
<iframe id="frameDemo" src="https://myvook.blogspot.com"></iframe>
<script>
$(document).ready(function() {
$( "#frameDemo" ).on('load', function() {
var mydiv = $(this).contents().find("body");
var h = mydiv.height();
$("#frameDemo").height(h);
});
});

Following up with what Rory said, it's not possible to set the iframe height before before the iframe has been loaded since you'll be pulling content from another domain.
However, it is possible to set the height of the iframe after you've downloaded the content. Here is how I've tackled it:
function noteContentIframeLoaded(iframeId) {
// See http://stackoverflow.com/a/5788723 for how to implement this function
var iframeElement = $("#" + iframeId)[0];
setTimeout(function() {
setIframeHeight(iframeElement);
}, 10);
}
function setIframeHeight(iframe) {
if (iframe) {
if (iframe.contentWindow || iframe.contentDocument) {
var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
if (iframeWin.document.body) {
iframe.height = (iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight);
}
}
}
}

HTML/JavaScript: How to copy text from a iframe

I'm kinda new to web development. I'm trying to copy text from a iframe into a textarea on a Bootstrap-html webpage.
An example of my code is here: https://jsfiddle.net/fe5ahoyw/
JavaScript
I have tried:
var a = document.getElementById('LD1');
var b = document.getElementById('OD1');
if (a != null)
{
b.value = a.value;
}
I have also tried:
var a = document.getElementById('LD1').innerHTML;
var a = document.getElementById('LD1').value;
var a = document.getElementById('LD1').html;
Any help would be any help would be much appreciated
Frostie

The JSFiddle is currently trying to access a http resource. As JSFiddle itself is https, most browsers will not like this very much.
That said, the selectors you are using inside the code are ... off. You need to get the frame itself -> content of the frame -> element within the frame you are interested in. I'd suggest using something like:
var a = document.getElementById('OD1');
var iFrame = document.getElementById('LD1');
var iFrameDocument = iFrame.contentDocument || iFrame.contentWindow.document;
content = iFrameDocument.body.textContent;
alert(content);
if (content)
{
a.value = content.value;
}

Getting Contents of Iframe with Pure JavaScript

I already can get the content of an Iframe with jQuery, though I would like to learn how to get it with pure JavaScript.
This is what I have so far.
var frame = document.getElementById('awc_frame');
var easyBB = frame.contentWindow.document.body.innerHTML;
easyBB.getElementById('chatbox-title').innerText="Chatbox";
What am I doing wrong, please help. Also originally the frame does not have an ID, and I already tried this
var frame = document.frames['awc_frame'];
Is that cross browser efficient? And then how do I get the contentWindow? Just some explanation so I can do this with JavaScript and not jQuery. jQuery version is this
var frame = $('#avacweb_chat iframe');
var easyBB = $('#chatbox-title',frame.contents()).text('Chatbox');

If it is on the same domain, try this. It won't let you access iframe contents if the iframe is of a different origin than the window that you are viewing.
var iframe = document.getElementById("awc_frame");
var iframe_contents = iframe.contentDocument.body.innerHTML;
Working example with jsfiddle iframe viewing a page on the same domain:
http://jsfiddle.net/tqAL3/1/

The same answer as Nile but as a function more similar to the querySelector
// iframe-query-selectors.js v1
function iframeQuerySelector(iframe, selector, all){
if( iframe && (iframe.nodeName || iframe.tagName) === 'IFRAME' && iframe.nodeType === 1){
all = all ? 'All' : '';
if(selector){
return iframe.contentDocument['querySelector' + all](selector);
};
return iframe.contentDocument;
};
throw new Error('The element must be an iframe.');
};
function iframeQuerySelectorAll(iframe, selector){
return iframeQuerySelector(iframe, selector, true);
};

How to open a new window and insert html into it using jQuery?

I am trying to open a new window from javascript but nothing is being inserted into the html:
var callScriptText = $('#callScriptText').html();
var url = '/Action/CallScript/?callScript=';
// Open the current call script in a new window
var openWindow = window.open(url, 'callScriptPopup', 'width = 500, height = 500');
$(openWindow).html(callScriptText);
Does anyone know why?

Here's an example to open a new window with content using jQuery
<script>
function nWin() {
var w = window.open();
var html = $("#toNewWindow").html();
$(w.document.body).html(html);
}
$(function() {
$("a#print").click(nWin);
});​
</script>
<div id="toNewWindow">
<p>Your content here</p>
</div>
Open​
EDIT:
For those who say that this code doesn't work, here's a jsfiddle to try it http://jsfiddle.net/8dXvt/

Try this:
var x=window.open();
x.document.open();
x.document.write('content');
x.document.close();
I find it works in Chrome and IE.

Building upon #Emre's answer.
With javascript, you can chain, so I just modified the code to:
var x=window.open();
x.document.open().write('content');
x.close();
Also, to force it to a new window (not a new tab), give the first line dimensions. But it has to be the third argument. So change the first line to:
var x=window.open('','','width=600, height=600');

try:
var x = window.open('', '', 'location=no,toolbar=0');
x.document.body.innerHTML = 'content';

var codeContents = $("#contentsfornewWindow").html()
var win = window.open('', 'title', 'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=1000,height=1000,left=200,top=70');
win.document.body.innerHTML = codeContents;
VS:
win.document.write(codeContents);
I have notice if there are iframes like youtubes videos , win.document.write loads the iframes where as document.body.innerHTML does not!

Load URL from text box into iframe

How do you load a URL from a text box into iframe in a HTML file via javascript?

var oIFrame = document.getElementById("id_of_iframe");
oIFrame.src = document.getElementById("id_of_textbox").value;

Or with document.frames if its the only iframe you are using:
var myIframe = window.document.frames[0]; // lets grab the iframe object
if (myIframe != null){
myIframe.src = document.getElementById("id_of_textbox").value; // set the value as source.
}

Just to add I guess, via jQuery
$('iframe#guid').src( $('#textbox_id').val() );
with error checking:
var iframe = $('#guid');
if(iframe.length > 0){
iframe.attr('src', $('#textbox_id').val());
}