Loading jquery within iframe - javascript

I am using javascript to embed iframe, and I want to load jquery in the iframe. However, it doesn't work. Could you please give me any advice?
(function() {
'use strict';
var iframe = document.createElement('iframe');
iframe.scrolling = 'no';
iframe.frameBorder = 0;
iframe.marginWidth = 0;
iframe.marginHeight = 0;
var widget = "<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>"
var doc = iframe.contentWindow.document;
doc.open();
doc.write(widget);
doc.close();
})();

This line:
var widget = "<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>"
Has the problem that you are opening with " for the widget string, but you are also using double quotes inside that string. Change it to:
var widget = "<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>"

Related

Load Amazon Associates after DOM content

I am trying to load Amazon Ads code after the page is loaded. If I add JS code after DOM loaded, the block with ads is not working.
var myscript = document.createElement('script');
myscript.setAttribute('src','//z-na.amazon-adsystem.com/widgets/onejs?MarketPlace=US');
Full source code of ads looks like:
<script type="text/javascript">
amzn_assoc_placement = "adunit0";
amzn_assoc_search_bar = "false";
amzn_assoc_tracking_id = "trackid-20";
amzn_assoc_ad_mode = "search";
amzn_assoc_ad_type = "smart";
amzn_assoc_marketplace = "amazon";
amzn_assoc_region = "US";
amzn_assoc_title = "Some title";
amzn_assoc_default_search_phrase = "Search phrase";
amzn_assoc_default_category = "All";
amzn_assoc_linkid = "sajdlkasjdklaskdlkajskdasdas";
amzn_assoc_rows = "1";
</script>
<script async src="//z-na.amazon-adsystem.com/widgets/onejs?MarketPlace=US"></script>
What am I doing wrong? The console write that:
Failed to execute 'write' on 'Document': It isn't possible to write
into a document from an asynchronously-loaded external script unless
it is explicitly opened.

Adding and running external javascript file in new window.open()

I want adding and running external javascript file in new window.open() , so I tested the solution in Running Javascript in new window.open , but this solution doesn't work.
My code is here :
<input type="button" value="Open a window" onclick="openWindow();">
<script type="text/javascript">
function openWindow()
{
//Open a new window :
var win = window.open("");
//Create script tag :
var script = document.createElement('script');
//Add external javascript file in src attribut of script tag :
script.src = "script.js";
//Append script tag to the new window :
win.document.head.appendChild(script);
}
</script>
The content of external javascript file called script.js is :
alert("It works !");
When you click the button, a new window is opened, but the external javascript file added is not executed.
So how to run the external javascript file added in new window opened ?
Use document.write
const win = window.open('')
win.document.open()
const html = `
<html>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"><\/script>
</head>
<body>
<h1>Test</h1>
<script>alert($('h1').text())<\/script>
</body>
</html>
`
win.document.write(html)
win.document.close()
Try this
<script type="text/javascript">
function openWindow()
{
//Open a new window :
var win = window.open("");
//Create script tag :
var script = document.createElement('script'),
div = document.createElement('div');
//Add external javascript file in src attribut of script tag :
script.src = "https://cdnjs.cloudflare.com/ajax/libs/preact/8.3.1/preact.min.js";
script.type = "application/javascript";
script.defer = true;
div.appendChild(script);
win.document.body.appendChild(div);
}
</script>
In the new window open developer console and type preact you will see output like {h: ƒ, createElement: ƒ, cloneElement: ƒ, Component: ƒ, render: ƒ, …}

Inserting <script>codehere</script> in header via JS in the body?

http://jsfiddle.net/8wGRg/
<script>
document.getElementsByTagName("head")[0].appendChild("<scr" + "ipt>alert('Hi!');</scr" + "ipt>");
</script>
I have a PHP string which contains JS code. For the sake of this code, lets say my string is <script>alert('Hi!');</script>. Within the body of my HTML document, how can I use JS to insert the JS string into the head.
As you can see, I'm breaking the word script into two parts so that it doesn't actually process it in the body before pushing it to the head.
The PHP string contains this:
<script type='text/javascript'>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
var gads = document.createElement('script');
gads.async = true;
gads.type = 'text/javascript';
var useSSL = 'https:' == document.location.protocol;
gads.src = (useSSL ? 'https:' : 'http:') +
'//www.googletagservices.com/tag/js/gpt.js';
var node = document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();
</script>
<script type='text/javascript'>
googletag.cmd.push(function() {
googletag.defineSlot('/1019006/ba_ad_footer_728x90', [728, 90], 'div-gpt-ad-1378123123651-0').addService(googletag.pubads());
googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
</script>
PHP code to generate JS:
<?php $header_code = $GLOBALS['settings']['header_code']; // just an example of how I load the code ?>
JS to insert the PHP
document.getElementsByTagName("head")[0].appendChild("<?php echo $header_code; ?>");
It doesn't append it because you are trying to append a string instead of a DOM node.
var s = document.createElement('script');
s.appendChild(document.createTextNode('alert("Hi!")'));
document.getElementsByTagName("head")[0].appendChild(s);

Write JavaScript code inside JavaScript and all in PHP?

I have an ad that will appear when certain conditions, and when that ad appears, the ad will detect the width of the screen and use the ad size that I specify.
I did this using JavaScript, and inside JavaScript and all are in PHP. Problems arise when writing in document.write.
Could you please help me solve this problem.
This is my code:
<?php
if(!empty($variable1)) {
echo '
<script type="text/javascript">
var swidth = screen.width;
if (swidth >= 1218) {
document.write('
<script type="text/javascript">
document.write("
<script type='text/javascript'>
var adcode = {abcdefg};
</script>
<script type='text/javascript' src='http://domainname.com/ads.js'></script>
");
</script>
');
}
</script>
';
} else {
if(!empty($variable2)) {
echo $ads2;
} else {}
}
?>
from line 13 to 22 replace:
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://domainname.com/ads.js';
$("body").append(script);
var script2 = document.createElement('script');
script2.type = 'text/javascript';
script2.src = 'sc.js';// or url to the script file;
$("body").append(script2);
and sc.js:
var adcode = {abcdefg};
BUT
The best way to add JS in PHP:
<?php
// ...
?>
<script src="url_to_script"></script>
<?php
// ...
?>
Manipulations with DOM elements must be defined in JS and not affect PHP.

Injecting javascript dynamically and using it

I also create a javascript file dynamically that uses those variables:
function callbackF(data){
console.log(data.script);
document.getElementsByTagName('head')[0].innerHTML=data.script;
var script = document.createElement("script");
script.setAttribute("src", "http://widget.example.com/sprk.1.0.2.js");
script.setAttribute("type", "text/javascript");
script.setAttribute("id", "grazit_script");
document.getElementsByTagName('head')[0].appendChild(script);
}
This is what i get in my head:
This is what is printed to the console log:
<script type='text/javascript'>var dbnwid=16476; var dbnpid=23369; var dbnwebid=19720; var dbnlayout=21; var dbncolor='#000000'; var dbntitlefontsize='14'; var dbnbgcolortype=1; var dbnheader='You might enjoy reading:'; var dbnremindercolor=2; var dbn_protocol = (('https:' == document.location.protocol) ? 'https://' : 'http://'); </script>
and then the script:
<script src="http://widget.example.com/sprk.1.0.2.js" type="text/javascript" id="grazit_script"></script>
The second script should get the variables that are in the second script..but it doesnt..then it complains about why it doesnt get those variables
UPDATE:
Both of those ways below didnt work for me:
eval(data.script);
var ss= new Function(data.script)();
Because scripts run when they are loaded. Adding a script tag using innerHTML doesn't run the code inside the tag.

Categories

Resources