SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Addict Smola's Avatar
    Join Date
    Mar 2005
    Posts
    260
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Linked script not running; No error shown

    I recently bought the book on Javascript written by this very site team. As I am reading along I am trying to execute the examples on my own machine (a novel idea I know). One example in the book uses the DOM to find elements by class. I copied this function word for word and symbol by symbol in a core.js file that is in a folder called "scripts" in my root directory. I then started to explore how to run certain scripts only when the page loads. I added into my core.js the following code as a test:

    Code javascript:
    function init() {
       alert("Hello there");
       }
     
    window.onload=init;
    The alert didn't show. I then tried to insert the alert ONLY into my script tags in the document itself for testing purposes. Still nothing. THEN I removed the src from the script tags in my document and the manual alert showed. I assume there must be some error or conflict with my core.js file. I don't understand how anything could be wrong however if I typed it word for word from the book! Here are the contents of the file:

    Code javascript:
    // JavaScript Document
     
    Core.getElementsByClass = function(theClass) {
     
    var elementArray[];
     
    if (typeof document.all != "undefined") {	//Explorer 5.x and other browsers only
    	elementArray = document.all;			//support document.all to retrieve all document
    	}										//elements
    else {
    	elementArray = document.getElementsByTagName("*");
    	}
     
    //the following variable uses RegExp to find a particular string pattern.
    //in this case, it is the name of the class we are searching for.
    var pattern = new RegExp("(^| )" + theClass + "( |$)");
     
    var matchedArray[];		//to hold matched class name elements
     
    //now we need to search through all the collected elements in the document and
    //see if they match the class pattern described in the var pattern
    for (var i=0; i<elementArray.length; i++) {
    	if (pattern.test(elementArray[i].className)) {
    		matchedArray[matchedArray.length]=elementArray[i];
    		}
    	}	//end for loop
     
    return matchedArray;
     
    }	//end Core.getElementsByClass
     
     
    alert("Hello there");

    and here is my page source without the src attribute in the scripts tags:

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Java Testing</title>
    
    <script type="text/javascript" language="javascript">alert('Hi');</script>
    
    </head>
    
    <body>
    </body>
    </html>
    Hopefully the php formatting didn't throw anyone off...I also tried the manually insert the function init() into the javascript tags directly on my document and that DID work.

    Any ideas?
    Last edited by Smola; May 19, 2008 at 05:33. Reason: Change to javascript highlighting

  2. #2
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,290
    Mentioned
    198 Post(s)
    Tagged
    3 Thread(s)

    init function

    I'm not sure if this will help, but try
    HTML Code:
    function init() { 
       alert("Hello there"); 
       } 
    
    window.onload=init();
    or
    HTML Code:
    init = function() { 
       alert("Hello there"); 
       } 
    
    window.onload=init;

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    you are assigning a value to Core.getElementsByClass when Core doesn't even exist.

    Before that statement you will need to make sure that the Core is defined.

    Code javascript:
    // If Core doesn't exist, make it an empty object
    Core = Core || {};
    Core.getElementsByClass = function(theClass) {
    ...

    Two other problems are related, which are how the arrays are being defined.
    The bad code has been commented out and is followed by the good code.

    Code javascript:
    // var elementArray[];
    var elementArray = [];
    ...
    // var matchedArray[];
    var matchedArray = [];

    With those errors out of the way, everything else works as expected.
    Last edited by paul_wilkins; May 15, 2008 at 17:04.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    SitePoint Addict Smola's Avatar
    Join Date
    Mar 2005
    Posts
    260
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I made those changes in the core.js script but the alert in the script will still not run. I find it a bit odd that a book written by the site creators would include incorrect code in their script. I think that a good point was made that the object Core was never defined, but as will variables I thought that the first instance of the object would automatically create it. I guess I could be wrong. However the way that the array variables were defined is straight from the book. The book is not that old, how could the syntax be bad?

    pmw57, did you copy and run the script on your own machine and it worked?

  5. #5
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The code works. You just can't pull out the functions and use them independently without defining the Core object. There are reasons some of those code blocks are labeled as excerpts.

    I have a copy of the book and the "=" are in there.

    You can check out the Errata to see the actual errors in the book though.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  6. #6
    SitePoint Addict Smola's Avatar
    Join Date
    Mar 2005
    Posts
    260
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Kravvitz, thank you! I guess the defining of the object does make a difference and does indeed make logical sense. I fixed the errors, defined the object, and the function call worked!

    pmw57, I apologize for thinking your corrections were wrong in regards to defining the arrays. The equal signs are indeed in there. All I needed to add was:

    Code:
    var Core = {};
    and everything worked as expected. This is going to make my job a whole lot tougher though because there was no error pointing me to which line of code was erroneous as I am used to. There isn't an error at all! So if it doesn't run, I guess I am supposed to search through all of my code to find the error. Unless there is a javascript editor that would help me? I am using Dreamweaver at the moment and it does not point out errors. Is there a better alternative?

    Also, what is the bbCode for javascript here on the Sitepoint forums?

    Thanks again Kravvitz!!
    Last edited by Smola; May 17, 2008 at 09:38. Reason: spelling errors..=X

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    When using Firefox the Error Console shows the following error

    Error: missing ; before statement
    Source File: file:///C:/Documents&#37;20and%20Settings/pwilkins/Desktop/test.html
    Line: 9, Column: 17
    Source Code:
    var elementArray [];
    And a similar error for the other matchedArray.

    After those are fixed the next error is

    Error: Core is not defined
    Source File: file:///C:/Documents%20and%20Settings/pwilkins/Desktop/test.html
    Line: 8
    Which lets you know that the Core object doesn't exist.

    Troubleshooting your script with Firefox is realtively easy with the Error Console.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    SitePoint Addict Smola's Avatar
    Join Date
    Mar 2005
    Posts
    260
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Awesome thanks! I didn't know I had that resource...I will definitely be using it from now on for troubleshooting!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •