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.
Related
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>"
I'm trying to pass java script code to the script tag and it is being displayed as plain text. How should i correctly pass the object so that the value is populated correctly
var script = $('<script>', {
type: 'text/javascript',
src: 'mcbz.com/models?type=c43&geo=true&languageselected='+ window.location.pathname.substring(1,6)
});
script[0].setAttribute("async", "");
$('script:first').before(script);
Expected result
<script async src="mcbz.com/models?type=c43&geo=true&languageselected=en" ></script>
You can try this out.
const script = document.createElement("script");
script.type = "text/javascript";
script.src = `mcbz.com/models?type=c43&geo=true&languageselected=${ window.location.pathname.substring(1,6)}`;
script.setAttribute("async", "");
$("head").append(script);
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: ƒ, …}
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);
I am making a small project that will let:
different websites to load my external javascript file: something like this:
<script type="text/javascript">
var vsid = "SA89696";
(function() {
var vsjs = document.createElement('script'); vsjs.type = 'text/javascript'; vsjs.async = true; vsjs.setAttribute('defer', 'defer');
vsjs.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'example.com/robot/robot.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(vsjs, s);
})();
</script>
now I want to use jquery in my javascript file, I dont have problem to load it by myself,
but I dont want to cause errors to the curresnt website if it already loaded jquery.
do you have any suggestions how to load jquery with no overrides.
You need something like this:
<script>
if(!window.jQuery)
{
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "path/to/jQuery";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
It checks if jQuery is loaded or no..
Source