javaScript placement in HTML File

javascript code in html file must be inserted between <script> and </script> tags.

javascript can be put in the <head> and in the <body> section of html, and/or in both.

you can place an unlimited number of scripts in an html doucment.


the HTML <script> element

the html <script> element is used to embed or reference an executable script within an html or xhtml document.

<script> and </script> tells where the javascript starts and ends.

syntax:

                  <script>

                                     //java scripting code put here
                                 
                  </script>

note: javascript is the default scripting language in all modern browsers and in html5.the type attribute in   <script type="text/javascript">   element is no required.

you may also use a meta tag in the head of the document to specify a default scripting language for the entire page.

                 <meta   http-equiv = "content-script-type"      content = "text/javascript" />

example :put script code in the head and body section.

      <!doctype   html>

        <html>
                               
         <head>
                               
                   <script>   var  v =10;  var b = 20 ; </script>
                          
       </head>
                               
                   <body>
                               
                             <script>
                                  
                    document.write("<h2>this is the body part script code</h2>");
                                       
                        </script>
                                  
                    </body>
        
                 </html>          
       <html>
        
          <head>
          
              <title> insert java script code inside the html file </title>
              
                <script    type="text/javascript">
                
                    function  alert_s(){
                    
                          alert("this is the javascript  code  for alert box");
                          
                        }  
                          
                 </script>
                 
                <body>
                
                   <h1> this is the html body section you can put script code inside the body section </h1>
                   
                     <script   type="text/javascript">
                     
                            function  show(){
                            
                                        alert("this is body section");
                                        
                                     }
                                     
                           </script>
                           
                         <script>
                         
                                 x = 23 + 45 ;
                                 
                                 y = 45 + 50 ;  alert( x + y );                                 
                                                                 
                          </script>                         
                                     
     </body> </html>                                        
      

internal JavaScript

Using inline JavaScript allows you to easily work with HTML and JavaScript within the same page. This is commonly used for temporarily testing out some ideas, and in situations where the script code is specific to that one page.

      <!doctype   html>

        <html>
                   <body>
                               
                             <script>
                                  
                    document.write("<h1>this is the body part script code</h1>");
                                       
                        </script>
                                  
                    </body>
        
                 </html>          

external javaScript

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.

external javascript files have the file extension .js

to use an external script, point to the .js file in the "src" attribute of the <script> tag:

      <!doctype   html>

        <html>
                               
          <head> 
          
             <script    src="screen.js"></script>
               
          </head>
                               
                   <body>
                               
                             <script    src= "output.js"></script>
                                  
                    </body>
        
                 </html>          

putting all the scripts used in a site in a common script directory similar to how images are stored in an images directory.this will ensure proper caching, keep scripts separated from content, and start a library of common code for use in a site.


JavaScript - use <noscript> tag

the <noscript> tag support in all major browser.it most important use is provide content for people accessing the web page with a browser that either does not support client side scripting or that has had its script support disabled by the user, perhaps for security reasons.you can put html code inside noscript tag look like-

 
     <html>
     
       <head><title> noscript tag example </title> 
       
        </head> <body>
        
        <script>
        
         document.write("<h1>the first heading </h1>");
         
         document.write("<h2>the second heading</h2>");
         
       </script>
       
      <noscript>
      
        <img src="http://www.w3webtutorial.com/images/webaccess.jpg" />
        
        <p>please enabled your browser for javascript,
        
          your browser dose not support javascript or it is currently disabled.  </p>
        
        <p><a href="http://www.w3webtutorial.com" >go this page </a> </p>
        
     </noscript>
      
    </body>
    
   </html>

xhtml compatibility

XHTML rules are much stricter than those of HTML.When special XML characters (such as & and < >) are used in scripts in XHTML files, they cause errors. The simplest workaround is to use external script files. However, if you simply must write inline scripts, then you will need to include CDATA (character data) sections in your file. Within CDATA sections the special XML characters can be used freely. The following example uses a CDATA section that is compatible with both XHTML and HTML syntax. Note that XHTML also requires the use of the �type� attribute.

            <script      type="text/javascript">
            
                <![cdata[
                
                   alert ((1<2)  &&  (3 > 3));
                
                ]]>

        </script>