Problem with returning

Community Forums/General Help/Problem with returning

Guy Fawkes

(Posted 2015) [#1]

Hi all! :) I've been working on a project in Javascript for quite some time now and I have come to a stand-still. I would like to replace "document.write" with a "cross-browser-friendly" version of "document.write". I've run into a small problem, though.

What I wanna do is instead of using document.write, I wanna use document.appendChild to load multiple scripts on my website at once in an asynchronous fashion so that the load times improve significantly, and it can be used as a "cross-browser" script.

Here's the code:

<html>

	<meta charset="UTF-8" />

	<head>
	
		<title>Add Multiple Scripts</title>
		
	</head>
	
	<body>
	
		<script type='text/javascript' src='http://code.jquery.com/jquery-1.11.2.min.js'></script>

		<script type='text/Javascript'>

			$(document).ready
			(

				function()
				{

					var listToArray = function(fullString, separator)
					{

						separator = separator || ', ';

						var fullArray = [];

						if (fullString !== undefined)
						{

							if (fullString.indexOf(separator) == -1)
							{

								fullArray.push(fullString);

							}
						
							else
						
							{

								fullArray = fullString.split(separator);

							}

						}

						return fullArray;

					}

					var Load_Plugins = function(locs, separator)
					{

						separator = separator || ', ';

						var locations = listToArray(locs, separator);

						return locations;

					}

					var load_files = [];
						
					var script_dir = [];

					var script_files = [];

					script_dir[0] = '../../script_dir_1/';
					script_dir[1] = '../../script_dir_2/';
					script_dir[2] = '../../script_dir_3/';

					script_files[0] = 'script1.js';
					script_files[1] = 'script2.js';
					script_files[2] = 'script3.js';

					var scripts = document.getElementsByTagName('script');

					for( x = 0; x <= scripts.length; x++ )
					{

						load_files[x] = Load_Plugins ( script_dir [ x ] + script_files [ x ] );

						if ( typeof ( load_files[x] !== 'undefined' ) )
						{

							alert(load_files[x]);

							// Insert all script srcs', here

							document.body.appendChild(load_files[x]);

						}

					}
					
				}
				
			);

		</script>

	</body>

</html>

For some reason, I'm getting the following error on line 93 of this code:

TypeError: Argument 1 of Node.appendChild does not implement interface Node.

I KNOW I'm returning an object to it as this returns an array.

If someone could please help me out, I would GREATLY appreciate it!

Thank You very much, and have a nice day! =)

Sincerely,

~GF

Matty

(Posted 2015) [#2]

An array is not a DOM object . You can only append actual elements, including script to a document.

Guy Fawkes

(Posted 2015) [#3]

Ok, so what should I change to make this code work?

Matty

(Posted 2015) [#4]

Well if you are returning an array ... perhaps iterate through it and append the elements wtihin...assuming they are DOM objects....

I haven't looked closely enough know what exactly is inside that array...

Guy Fawkes

(Posted 2015) [#5]

O, what's in the array is just a list of javascript folder locations such as "./myjsfiles/", and then I add on the file name like this: "myjsfile.js".

Matty

(Posted 2015) [#6]

Well... use create element to create a script element. Set the src to the url and append the script to the document.

Something to be aware of....while you can dynamically add script elements the only time they are interpreted is at the time the document loads...

Guy Fawkes

(Posted 2015) [#7]

Which is the reason for:

$(document).ready
(

    function()
    {
    }

);

At any rate, can you show me what you have in mind with that whole "src" & "script element" thing?

Thanks again!

Sincerely,

~GF

Matty

(Posted 2015) [#8]

googling gave this as a reasonably good answer:

"google load script dynamically"

https://www.google.com.au/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=google%20load%20script%20dynamically

http://www.nczonline.net/blog/2009/07/28/the-best-way-to-load-external-javascript/