Pages

Saturday, August 20, 2011

LEARNING JAVASCRIPT - PLACING THE CODE 2 (LABEL: JAVASCRIPT TUTORIAL)

1.       WELCOME
1.       INTRODUCTION  1 - 2 - 3
2.       FIRST PROGRAM
2.       BASICS
1.     PLACING THE CODE -  1
2.       LEXICAL STRUCTURE
1.       RESERVED WORDS
3.       VARIABLES AND TYPES
NUMBERS ● STRINGS ● DATES ● ARRAYS
4.       OPERATORS
5.       CONTROL STRUCTURES
6.       FUNCTIONS AND OBJECTS
7.       EVENT HANDLING
8.       REGULAR EXPRESSIONS
3.       ADVANCED TOPICS
1.       OBJECT ORIENTED PROGRAMMING
1.       CONSTRUCTORS AND PROTOTYPES
2.       INHERITANCE
3.       ACCESS CONTROL
2.       FUNCTIONAL PROGRAMMING IN JAVASCRIPT
1.       FUNCTION OBJECTS
2.       ANONYMOUS FUNCTIONS
3.       CLOSURES
4.       HIGHER ORDER FUNCTIONS
3.       MODULAR JAVASCRIPT
1.       MODULES
2.       NAMESPACES
4.       OPTIMIZATION
5.       METAPROGRAMMING
6.       BOOKMARKLETS
4.       DEBUGGING
1.       JAVASCRIPT DEBUGGERS
2.       COMMON MISTAKES
3.       DEBUGGING METHODS
4.       BROWSER BUGS
5.       DYNAMIC WEB CLIENT PROGRAMMING (DHTML)
1.       RUNTIME DOCUMENT MANIPULATION
1.       INTRODUCTION TO THE DOCUMENT OBJECT MODEL (DOM)
2.       FINDING ELEMENTS
3.       ADDING ELEMENTS
4.       CHANGING ELEMENTS
5.       CHANGING ELEMENT STYLES
6.       REMOVING ELEMENTS
2.       EVENT HANDLERS
1.       SIMPLE EVENT HANDLERS
2.       W3C EVENT HANDLERS
3.       EXTENDED EVENT HANDLERS
3.       RUNNING SCRIPTS AT PAGE LOAD
4.       SOUL BUILDING JAVASCRIPT
5.       XML AND JAVASCRIPT
1.       DOM MANIPULATION
2.       XSL SPRINKLES
6.       DHTML EXAMPLES
6.       ADVANCED WEB CLIENT PROGRAMMING
1.       WORKING WITH IMAGES
2.       WORKING WITH FORMS
3.       WORKING WITH COOKIES
4.       CLIENT-SERVER PROGRAMMING (AJAX)
1.       XMLHTTPREQUEST
2.       HANDLING HTML
3.       HANDLING JSON
4.       HANDLING XML
5.       DESIGN MODE
7.       JAVASCRIPT OUTSIDE HTML
1.       ACTIONSCRIPT IN FLASH
2.       ADOBE PDF FORMS
3.       JSOSA FOR THE MACINTOSH
4.       JSCRIPT IN MICROSOFT WSH
8.       STANDARDS AND BEST PRACTICES
1.       NAMING CONVENTIONS
2.       CODE STRUCTURING
3.       ACCESSIBILITY
9.       APPENDICES
1.       INDEX
2.       LINKS
3.       USEFUL SOFTWARE TOOLS
4.       HISTORY OF JAVASCRIPT
5.       CONTRIBUTORS

LINKS TO GO THROUGH IN THE NEXT POST in part 2

Linking to external scripts
JavaScript is commonly stored in a file so that it may be used by many web pages on your site. This makes it much easier for updates to occur and saves space on your server. This method is recommended for separating behavior (JavaScript) from content ((X)HTML) and it prevents the issue of incompatibility with inline comments in XHTML and HTML.
Add src="script.js" to the opening script tag. Replace script.js with the path to the .js file containing the JavaScript.
Because the server provides the content type when the file is requested, specifying the type is optional when linking to external scripts. It's still advised to specify the type as text/javascript, in case the server isn't set up correctly, and to prevent HTML validation complaints.
<script type="text/javascript" src="script.js"> </script>
Location of script elements
The script element may appear almost anywhere within the HTML file.
A standard location is within the head element. Placement within the body however is allowed.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Web page title</title>
    <script type="text/javascript" src="script.js"></script>
</head>
<body>
<!-- HTML code here -->
</body>
</html>
There are however some best practices for speeding up your web site [4] from the Yahoo! Developer Network that specify a different placement for scripts, to put scripts at the bottom, just before the </body> tag. This speeds up downloading, and also allows for direct manipulation of the DOM while the page is loading.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Web page title</title>
</head>
<body>
<!-- HTML code here -->
<script type="text/javascript" src="script.js"></script>
</body>
</html>
Labels:

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)