Including javascript within a js file

[Trenqo 0]

I'm looking for a way to include javascript files from within a ".js"
file. This would allow me to only need to link to one ".js" file, and
yet still organize my functions into non gargantuan files for easy
editing. I'm hoping there is some sort of include or import directive
that I could use. Or if no such directive exists, I'm wondering if
anyone has written one which I could use.

I need to do this without any server side scripting. For now at least,
the html is being used locally with local files.

I've found this:
http://www.forum4designers.com/archive22-2004-1-28286.html post about
the same problem, and was hoping that either someone here would have
more light to shed on the issue, or that there might be a way to do
this in the special situation of just working on a local, writable
drive.

-Trenqo

 

[ASM]

I'm looking for a way to include javascript files from within a ".js"
file. This would allow me to only need to link to one ".js" file, and
yet still organize my functions into non gargantuan files for easy
editing.

<script type="text/javascript">
// <![CDATA[

function includejs(file) {
document.write('<script src="' + file +
'"type="text/javascript"><\/script>');
}

function one() { blah }
function two() { bloh }
includejs('foo.js');
function three() { bluh }

// ]]>
</script>

 

[Richard Cornford]

ASM wrote:

<script type="text/javascript">
// <![CDATA[

In an HTML document the content type of a script element is CDATA. The
javascript comment makes this a redundant practice in an HTML document,
doubly redundant because the content is CDATA to start with.

function includejs(file) {
document.write('<script src="' + file +
'"type="text/javascript"><\/script>');
}

To date XHTML DOMs have tended not to support the - document.write -
method. Finding a call to the - document.write - method inside a
<![CDATA[ ... ]]> wrapper suggests misconceptions about the mark-up
being used and its relationship to the DOM being scripted.

Richard.

 

[RobG]

I'm looking for a way to include javascript files from within a ".js"
file. This would allow me to only need to link to one ".js" file, and
yet still organize my functions into non gargantuan files for easy
editing. I'm hoping there is some sort of include or import directive
that I could use. Or if no such directive exists, I'm wondering if
anyone has written one which I could use.

Use the following:

Include the following tag the HTML file(s) just after the body tag:

<script type="text/javascript" src="include.js"></script>


The file 'include.js' contains:

var scripts = [
'script_1.js',
'script_2.js'
];
if ( document.getElementsByTagName ) {
var head = document.getElementsByTagName('HEAD')[0]
var scriptElement;
var i = scripts.length;
while ( i-- ) {
scriptElement = document.createElement('script');
scriptElement.type = 'text/javascript';
scriptElement.src = scripts;
head.appendChild(scriptElement);
}
}


I seem to be able to get away with putting the script above script
element in the head, but I'm not sure that will be OK for all browsers.
It should be safe as the first element of the body.

I need to do this without any server side scripting. For now at least,
the html is being used locally with local files.

Provided the links point to the files, life will be fine. You may need
to check the order in which files are loaded, you don't want to be
calling functions that aren't loaded yet.

[...]

 

[VK]

I'm looking for a way to include javascript files

from within a ".js" file.

Well, the trully orthodox way is by using "import" instruction inside
of your code.

The catch 22 is that both main script and the "source" script have to
be signed by the same principals (So say if the main script signed by
John Doe, you can import only from archives signed by John Doe).

The catch 23 is that FF needs signed .jar file with JavaScript in it.
And IE needs signed .cab with JScript

All of above makes the import technologies nearly impossible. Over the
7 years this technologies exists I saw just a few such solutions, and
all of them for inside use (where the compatibility is not such an
issue).

So I would stay with RobG. Still good to know other options, I guess

 

[ASM]

ASM wrote:

<script type="text/javascript">
// <![CDATA[

In an HTML document the content type of a script element is CDATA. The
javascript comment makes this a redundant practice in an HTML document,
doubly redundant because the content is CDATA to start with.

My english being quite poor ... do you mean
<![CDATA[ ... ]]>
is not to use ?
(it is what I understand)

If that's right, why Tidy (from W3C) use that ?

To date XHTML DOMs have tended not to support the - document.write -
method.

Most of time I do javascript for NC4.5
Sometimes I add few DOM code when this code is only cosmetic
and of no importance in general fonctionalities of the html page.

Finding a call to the - document.write - method inside a
<![CDATA[ ... ]]> wrapper suggests misconceptions about the mark-up
being used and its relationship to the DOM being scripted.

So, how have I to write correctly (with a transitional doctype)
<script type= ....
and
this document.write() ?

 

[ASM]

Use the following:

Include the following tag the HTML file(s) just after the body tag:

<script type="text/javascript" src="include.js"></script>


The file 'include.js' contains:

var scripts = [
'script_1.js',
'script_2.js'
];
if ( document.getElementsByTagName ) {

Oh yes ! instersting method ! and for my NC 4.5 ?

var head = document.getElementsByTagName('HEAD')[0]
var scriptElement;
var i = scripts.length;
while ( i-- ) {
scriptElement = document.createElement('script');
scriptElement.type = 'text/javascript';
scriptElement.src = scripts;
head.appendChild(scriptElement);
}
}

 

[RobG]

ASM wrote:
[...]

Oh yes ! instersting method ! and for my NC 4.5 ?

The scripts will not be added as Netscape Navigator 4 (NN4) does not
support getElementsByTagName.

If all JS functionality is added using the suggested method, NN4 users
will get the default site without JavaScript - which may be a distinct
advantage, given that the use of NN4 indicates a very old PC that may
perform better without unnecessary scripts slowing it down.

 

[ASM]

ASM wrote:
[...]

Oh yes ! instersting method ! and for my NC 4.5 ?

The scripts will not be added as Netscape Navigator 4 (NN4) does not
support getElementsByTagName.

it was the why of my question

If all JS functionality is added using the suggested method, NN4 users
will get the default site without JavaScript - which may be a distinct
advantage, given that the use of NN4 indicates a very old PC that may
perform better without unnecessary scripts slowing it down.

we'll say that :-/

I keep your script as a good example of objects creation and placement

 

[Thomas 'PointedEars' Lahn]

<script type="text/javascript">
// <![CDATA[

In an HTML document the content type of a script element is CDATA.
The javascript comment makes this a redundant practice in an HTML
document, doubly redundant because the content is CDATA to start
with.

My english being quite poor ... do you mean
<![CDATA[ ... ]]>
is not to use ?
(it is what I understand)

It is not to be used in HTML documents served as text/html and JS
script files, and it is not necessary to be commented out in XHTML
documents served as application/xhtml+xml; serving XHTML as
text/html is considered harmful.

If that's right, why Tidy (from W3C) use that ?

Because it is a little bit buggy. Note: HTML Tidy is not from W3C,
it was originally developed by a W3C member and is now maintained by
several developers, obtainable from SourceForge.

Most of time I do javascript for NC4.5
Sometimes I add few DOM code when this code is only cosmetic
and of no importance in general fonctionalities of the html page.

But in this case it is, you just didn't recognize it.

Finding a call to the - document.write - method inside a
<![CDATA[ ... ]]> wrapper suggests misconceptions about the mark-up
being used and its relationship to the DOM being scripted.

So, how have I to write correctly (with a transitional doctype)
<script type= ....
and
this document.write() ?

Using node-accessing and node-creating methods introduced in W3C DOM
Level 1 HTML and DOM Level 2 Core; using the proprietary variants if
you need to.


PointedEars