How to add a script at runtime? (document.write is not a function)

Question

I trying to add a script to my Xul application at runtime, with:

document.write('<script type="text/javascript" src="chrome://myapp/content/myscript.js"/>');

but I got:

Error: document.write is not a function

The function does exist in the docs. I got also this example from the docs:

document.open();
document.write("<h1>Out with the old - in with the new!</h1>");
document.close();

but I got:

document.open is not a function

Any idea what's wrong?

--update

Maybe I could put my js code in a Javacript Module and import it with Components.utils.import (looking for where to put the resource and how to reference it)

Is something in your code at that scope level redefining 'document'? For example, is it a local variable that is hiding the real 'document' variable? — Tejs, May 04 '11 at 19:39

score 0 · Answer 1 · answered May 04 '11 at 19:41

0

The document.write function is not available if you are using XHTML; see: http://www.w3.org/MarkUp/2004/xhtml-faq#docwrite. It is likely that you are using XHTML.

You should evaluate whether you actually need to use XHTML. If not, then you will be able to use document.write. But if you do, you'll need to use an alternate approach to manipulating the DOM. You can do it directly using DOM methods, or you could use a helper library such as jQuery.

answered May 04 '11 at 19:41

Scott Moonen

738
4
8

I'm not sure, but I think that Xul is a XHTML language. About use DOM methods, I'm not sure, but I think it's just what I'm doing, isn't it? – The Student May 04 '11 at 20:45
Ahh, sorry, I missed the fact that you were doing XUL. I think that would be subject to the same restriction. Timofey's answer below should put you on the right track. The example he links (1) locates an existing element using getElementById() and then appends a new element after it. – Scott Moonen May 04 '11 at 21:07

score 0 · Answer 2 · answered May 04 '11 at 19:46

0

From this example.

Using the createElement method in XUL lets you accomplish things similar to document.write in HTML, with which you can create new pages and parts of a web page.

answered May 04 '11 at 19:46

Timofey Stolbov

4,501
3
40
45

Trying to add to the document.body I got `document.body is undefined`. Trying using window.appendChild (that is a inherited method as [the doc says](https://developer.mozilla.org/en/xul/window)), I got `window.appendChild is not a function`. Any idea what may be wrong here? – The Student May 04 '11 at 20:34

Karoline Brynildsen · Answer 3 · 2011-05-04T20:40:02.247

0

Do you have the javascript inside a script tag? And do you initiate the function somewhere in the code? It doesn't run it self.

This works:

<html>
<head>
<script type="text/javascript">
function addCont(){
document.open();
document.write("<h1>New text</h1>");
document.close();
}
</script>
</head>
<body onload="addCont()">
<p>Some text...</p>
</body>
</html>

edited May 04 '11 at 20:40

answered May 04 '11 at 20:34

Karoline Brynildsen

3,598
6
35
45

Yes, I do have the js inside a script tag, and I call the function in a setTimeout in the onload method. Isn't this supposed to work? – The Student May 04 '11 at 20:39
Maybe it's because you're adding a script tag to the document? – Karoline Brynildsen May 04 '11 at 20:47
http://stackoverflow.com/questions/236073/why-split-the-script-tag-when-writing-it-with-document-write – Karoline Brynildsen May 04 '11 at 20:52
Script will "run itself". Functions don't run themselves, but individual lines of code not in a function (like a lone `document.write()`) will run without needing to be called from some event. – nnnnnn May 05 '11 at 05:14
Ops, sorry, I misunderstand you. My script is in another file, and is included as `` – The Student May 05 '11 at 12:24

score 0 · Answer 4 · answered May 05 '11 at 05:28

You said in a comment on another answer that you were doing the document.write() in a function called from a setTimeout that itself was in the onload. I'd recommend against using document.write() after the page has loaded. According to the Mozilla doco:

an automatic document.open() call happens when document.write() is called after the page has loaded, but that's not defined in the W3C specification.

And because of the automatic document.open()

If a document exists in the target, this method clears it

From memory I thought older versions of IE just gave an error if you used document.write() after the page had loaded, but I can't be bothered trying to find anything in their doco.

And as somebody else mentioned, it doesn't work with xhtml.

Why do you even want to do the document.write() in this instance? Why not just include your script directly?

I want it because it's taking too long to open/load the window, and some scripts could be loaded only if the user request that function on that window. And I'm calling it after the page is loaded, to call before would not help to my goals, would be better include the script directly.. :) — The Student, May 05 '11 at 12:12

score 0 · Answer 5 · answered May 12 '11 at 19:39

0

There are two ways to dynamically load a script at runtime.

The first way is via the subscript loader.

The second way is to create an overlay that loads your script and dynamically load the overlay.

answered May 12 '11 at 19:39

Neil

54,642
8
60
72

How to add a script at runtime? (document.write is not a function)

5 Answers5