The document.write causing the error SCRIPT70: Permission denied if you use a few document.write inside iframe. This error occurs only in the Edge. In all other browsers this error is not observed.
For example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SSP-558</title>
</head>
<body>
<script>
document.write("1");
document.write("2");
</script>
<script>
var iframe = document.createElement("iframe");
iframe.width = window.outerWidth;
iframe.height = window.outerHeight;
iframe.onload = function () {
var doc = iframe.contentWindow.document;
var script = doc.createElement("script");
script.type = "text/javascript";
script.text = [
'document.write("1");',
'document.write("2");'
].join("");
doc.body.appendChild(script);
};
document.body.appendChild(iframe);
</script>
</body>
</html>
This code will display 12 on the page and in iframe, but it cause an error and displays only 1 inside iframe in Edge.
If you use only one document.write everything works fine. Unfortunately, the code that contains several document.write comes from a third-party developers and they can't change it.
Have you encountered this error and is there any solution for it?
There was found a solution. If you add window in front of document.write the error will not be caused.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SSP-558</title>
</head>
<body>
<script>
document.write("1");
document.write("2");
</script>
<script>
var iframe = document.createElement("iframe");
iframe.width = window.outerWidth;
iframe.height = window.outerHeight;
iframe.onload = function () {
var doc = iframe.contentWindow.document;
var script = doc.createElement("script");
script.type = "text/javascript";
script.text = [
'window.document.write("1");',
'window.document.write("2");'
].join("");
doc.body.appendChild(script);
};
document.body.appendChild(iframe);
</script>
</body>
</html>
Related
The onload="" method in html stays for "Fires after the page is finished loading"
I need a method that loads the < script > part directly at FIRST while the page is loading.
<!doctype html>
<html>
<head>
<!--Adobe Edge Runtime-->
<script>
var custHtmlRoot="hin-aktuell/Assets/";
var script = document.createElement('script');
script.type= "text/javascript";
script.src = custHtmlRoot+"edge_includes/edge.6.0.0.min.js";
var head = document.getElementsByTagName('head')[0], done=false;
script.onload = script.onreadystatechange = function(){
if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
done=true;
var opts ={
scaleToFit: "width",
centerStage: "none",
minW: "0px",
maxW: "undefined",
width: "1366px",
height: "768px"
};
opts.htmlRoot =custHtmlRoot;
AdobeEdge.loadComposition('hin-aktuell', 'EDGE-2489594', opts,
{"style":{"${symbolSelector}":{"isStage":"true","rect":["undefined","undefined","1366px","768px"],"fill":["rgba(255,255,255,1)"]}},"dom":{}}, {"dom":{}});
script.onload = script.onreadystatechange = null;
head.removeChild(script);
}
};
head.appendChild(script);
</script>
<style>
.edgeLoad-EDGE-2489594 { visibility:hidden; }
</style>
<!--Adobe Edge Runtime End-->
<script> alert(1); </script>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>NC | Allgemeines</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="feed.css">
</head>
here is the body part
<body>
<div id="EdgeStage">
<div id="Stage" class="EDGE-2489594"></div>
</div>
<div id="feeds">
<?php
$html = "";
$url = "http://www.yoursite.com";
$xml = simplexml_load_file($url);
for($i = 0; $i < 1; $i++){
$description = $xml->channel->item[$i]->description;
preg_match("/<img[^>]+\>/i", $description, $matches);
if (isset($matches[0])) {
$html .= $matches[0];
} else {
echo "No img";
}
}
echo $html;
?>
<div/>
</body>
now thats the hole file...
A page executes in order. If you place your script as the very first thing in <head>, it will execute before anything else. Note that due to its timing, the page's <body> will not exist yet (nor, in fact, anything else in <head>).
There is no event for when page starts loading, since there can't possibly be any code to handle such an event at that time. At least your <script> element needs to be loaded first.
sorry this problem might be resolved already, but I have not been able to find the answer.
I basically have 2 files:
form.html code:
<!DOCTYPE html>
<html>
<head>
<title>BACKUP MONITOR</title>
<script>
function getEvents()
{
alert("getEvents");
}
alert("in HTML");
var w = window.open();
var s = w.document.createElement("script");
s.type = 'text/javascript';
s.src = ".../fileA.js";
w.document.body.appendChild(s);
w.alert("New Window");
</script>
</head>
<body>
</body>
</html>
fileA.js code:
alert("in fileA");
getEvents();
Question:
I can't call getEvents() from fileA.js (new Window). Is there any way to do this?
thank you very much
In the below code after the download I want to print the downloaded file through jquery/javascript.
But couldn't Identify where I need to put the print command and how need to process. any help would be appreciated - thanks
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("a").click(function(e) {
$('a#test').attr({target: '_blank',
href : 'http://localhost/text.txt'});
});
var downloadURL = function downloadURL(url) {
var hiddenIFrameID = 'hiddenDownloader',
iframe = document.getElementById(hiddenIFrameID);
if (iframe === null) {
iframe = document.createElement('iframe');
iframe.id = hiddenIFrameID;
iframe.style.display = 'none';
document.body.appendChild(iframe);
}
iframe.src = url;
};
});
</script>
<body>
<a id="test" href="#">Download now!</a>
</body>
</html>
</head>
To print the content of the iframe just use:
iframe.contentWindow.print();
I have the below code that will dynamically create the script tag.
<html>
<head>
<title>Applying</title>
</head>
<body>
<script>
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,
function(m,key,value) {
vars[key] = value;
});
return vars;
}
var variable1 = getUrlVars()["parameter1"];
var myScript = document.createElement('script');
myScript.setAttribute('type', 'text/javascript');
myScript.setAttribute('urlId', '420');
myScript.setAttribute('dataTitle', variable1);
myScript.setAttribute('dataemail', 'admin#domain.net');
document.body.appendChild(myScript);
</script>
<input name="Apply" type="button" id="Apply" value="Apply" ONCLICK="window.location.href='https://www.google.com?'">
</body>
</html>
But somehow the above code doesn't work in IE but it works fine in Chrome. I am not sure what is the reason? Can anybody help me with that?
This whole things doesn't work in IE.
var myScript = document.createElement('script');
myScript.setAttribute('type', 'text/javascript');
myScript.setAttribute('urlId', '420');
myScript.setAttribute('dataTitle', variable1);
myScript.setAttribute('dataemail', 'admin#domain.net');
document.body.appendChild(myScript);
You can dynamically add a script element using the following function.
var create_script = function(data) {
var script = document.createElement('script');
script.type = 'text/javascript';
script.text = data;
//if you have to debug dynamically loaded script in chrome use the following - sourceURL has changed in the recent versions of chrome devetools.
//script.text = data + "\n\n //# sourceURL=" + ns + ".js\n";
//append the script element to body or head or where it seems fit.
document.body.appendChild(script);
}
the "data" parameter is the actual javascript code/URL that will form the part of the script tag. You are missing this in your code.
EDIT:
for non-standard attributes you might want to change the doctype according to http://www.w3schools.com/DTD/dtd_attributes.asp
My source code :
<!doctype html>
<html>
<head>
<title>onload test</title>
<link type="text/css" rel="stylesheet" href="spot.css" media="screen" />
</head>
<body>
<h1>Welcome Page</h1>
<script>
debugger;
function constructScripts(url, callBack) {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
if (script.readyState) {
script.onreadystatechange = function () {
if (script.readyState == "loaded" || script.readyState == "complete") {
script.onreadystatechange = null; callBack();
}
};
}
else {
script.onload = callBack;
}
}
</script>
<script>
debugger;
myCallBack = function () {
alert(this.src + "loaded");
}
constructScripts("files1", myCallBack);
constructScripts("files2", myCallBack);
constructScripts("files3", myCallBack);
</script>
</body>
</html>
this.src is undefined here. I guess this should be an 'script' object which supposed to have its src property so that I can read the filename. Who is this here? And also when I view the page source these scripts were not included in the header() section. Why is it so?
this.src is undefined here.
It shouldn't be… It is defined earlier: script.src = url
I guess this should be an 'script' object which supposed to have its src property so that i can read the filename. Who is 'this' here?
The script element upon which the onload or readystatechange event fires
And also when i view the page source these scripts were not included in the header() section. Why is it so?
Because you are looking at the page source, not a serialisation of the live DOM after it has been manipulated by JavaScript.
When you call you callBack function, pass it the script object like callBack(script). Modify the callBack function like
myCallBack = function (script) {
alert(script.src + "loaded");
}
View source does not show dinamically loaded elements.
You need to extend your function using prototype.
Element.prototype.MyMethod = function(){}
Look at your edited code
<!doctype html>
<html>
<head>
<title>onload test</title>
<link type="text/css" rel="stylesheet" href="spot.css" media="screen" />
</head>
<body>
<h1>Welcome Page</h1>
<script>
Element.prototype.MyMethod = function(){}
function constructScripts(url, callBack) {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = url;
script.MyMethod = callBack;
document.getElementsByTagName("head")[0].appendChild(script);
if (script.readyState) {
script.onreadystatechange = function () {
if (script.readyState == "loaded" || script.readyState == "complete") {
script.onreadystatechange = null;
script.MyMethod();
}
};
}
else {
script.onload = callBack;
}
}
</script>
<script>
myCallBack = function () {
alert(this.src + "loaded");
}
constructScripts("files1", myCallBack);
constructScripts("files2", myCallBack);
constructScripts("files3", myCallBack);
</script>
</body>
</html>