First time trying to place javascript in external file

JavaScript
1

this is my first time attempting this operation.

I want to take some javascript out of my html.

here is the original:

 <!--div#9begin--><div style="float: left; height: 166px; width: 1px;">
	<img alt="" src="images/border_short_vert.png" height="169" width="1" />
</div><!--div#9end-->

<!--div#10begin--><div style="width: 225px; height: 155px; float: left; height: 16px; background-color: #000000; color: #FFFFFF; margin-left: 0px; margin-bottom: 0px; font-size: small; padding-left: 0px;">
	&nbsp;<img alt="" src="images/news.png" height="16" width="222" /><!--div#11begin--><div style="width: 225px; height: 155px; float: left;"></div><!--div#11end-->
	
	<script type="text/javascript">// <![CDATA[if(document.layers){document.write('<ilayer id="ns4div" width="'+swidth+'" height="'+sheight+'" bgcolor='+sbcolor+'><div id="ns4div1" width="'+swidth+'" height="'+sheight+'" onmouseover="sspeed=0;" onmouseout="sspeed=rspeed"></div></ilayer>')}
if(document.getElementById||document.all){document.write('<div style="position:relative;overflow:hidden;width:'+swidth+'px;height:'+sheight+'px;clip:rect(0 '+swidth+'px '+sheight+'px 0);background-color:'+sbcolor+';" onmouseover="sspeed=0" onmouseout="sspeed=rspeed"><div id="iens6div" style="position:relative;width:'+swidth+'px;"></div></div>');} // ]]>
    </script>
    
</div><!--div#10end-->

and here’s my attempt:

 <div style="width: 225px; height: 155px; float: left; height: 16px; background-color: #000000; color: #FFFFFF; margin-left: 0px; margin-bottom: 0px; font-size: small; padding-left: 0px;">
	&nbsp;<img alt="" src="images/news.png" height="16" width="222" />[ICODE]<script type="text/javascript" src="docwrite.js"></script>[/ICODE]	
	
	<div style="width: 225px; height: 155px; float: left;"></div>

</div>

along with my js:

 if(document.layers)

{document.write('<ilayer id="ns4div" width="'+swidth+'" height="'+sheight+'" bgcolor='+sbcolor+'><div id="ns4div1" width="'+swidth+'" height="'+sheight+'" onmouseover="sspeed=0;" onmouseout="sspeed=rspeed"></div></ilayer>')}

if(document.getElementById||document.all)

{document.write('<div style="position:relative;overflow:hidden;width:'+swidth+'px;height:'+sheight+'px;clip:rect(0 '+swidth+'px '+sheight+'px 0);background-color:'+sbcolor+';" onmouseover="sspeed=0" onmouseout="sspeed=rspeed">

<div id="iens6div" style="position:relative;width:'+swidth+'px;"></div></div>');}

what is the problem? Have I not performed the extraction properly?

2

What is the error message you are getting?

Most modern browsers have developer tools that allow you to debug JavaScript, and they will usually give you the exact line on which the error occurs. This is a pretty simple one, so it’s a good opportunity to sharpen your debugging skills. These will be invaluable later on.

Cheers,
D.

3

wanted to ensure I had the right form correct. Can you verify that?

there shouldn’t be a bug unless I added a typo if my form is correct because it was working before i cut and pasted it into its own file.

firebug doesn’t report any errors! (I just checked)

you can check the page here if you’d like.

4

The next basic debugging step is to test your logic. Put a few alert() statements throughout your code to check that your if tests are working and/or functions are being called correctly.

Also whack a couple in your externally referenced js files at the top to make sure they’re being loaded.

Cheers,
D.

5

The issue is that swidth and other variables aren’t defined.

6

I’m sure he would have got there on his own in good time, pmw57.

Cheers,
D.

7

Possibly so, however his indication that Firebug didn’t seem to show any troubles might have knocked him for a six.

Now he can investigate deeper.

By the way, it was in Google Chrome that I opened up the Javascript Console to find that helpful info.

8

What’s the point of further investigation when you’ve shown him exactly what is wrong?

Cheers,
D.

9

Admittedly it wasn’t much of an investigation that I performed. Load up the page and a ctrl+shift+J and Bob’s your uncle.

He can now investigate how the problem occurred and then hopefully figure out some way to resolve it.

10

Don’t you think it’s more helpful to teach people problem solving skills, or introduce them to tools and resources that can help them become more effective at identifying errors and solving them?

Apologies for taking this thread OT a bit, but it’s the sort of thing I see here over and over again and I think it just perpetuates the cycle of “Why my codes no werk?!?!!”

Cheers,
D.

11

[QUOTE=disgracian;4474195]Don’t you think it’s more helpful to teach people problem solving skills, or introduce them to tools and resources that can help them become more effective at identifying errors and solving them?

That we certainly do, when the audience is ready for them. Many is the time when error consoles and resources such as jslint.com are put forward to help and assist people.

The other side of things that we do here is to help people move away from deprecated techniques, where we show them improved ways of handling things. This information then stays around for other people when they are searching for similar solutions.

12

While I know that also happens, I seem to see a lot more of people just doing the work for them. I know because I try to gently guide people to figuring it out for themselves and I never seem to be able to get there before somebody just hands it to them on a platter.

Cheers,
D.

13

That’s the trouble with this environment. It is not a one-on-one training ground. Anyone can step in to help or hinder at will.