how to validate this js code for xhtml strict

kevinkhan · #1 (**permalink**) 09-27-09, 06:39 AM

This the html code below. Im getting a few errors

1) there is no attribute "onload" and
2) there is no attribute "name"

PHP Code:


			
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

 <head>

  <meta http-equiv="content-type" content="text/html; charset=utf-8" />

  

<title>Navigation</title>







<link href="css/new.css" rel="stylesheet" type="text/css"/>



 <script type="text/javascript" src="js/nav.js"></script>

</head>



<body onload="MM_preloadImages('images/tab1.gif','images/tab1hover.gif','images/tab2hover.gif','images/tab3hover.gif','images/tab4hover.gif','images/tab5hover.gif')">

  <div id="wrapper">



    <div id="top">

      <div id="topright">  

        

       <div id="primaryNavWrapper">

        <div id="primaryNav">

          <a href="javascript:;" onclick="MM_nbGroup('down','group1','tab1','images/tab1hover.gif',1)" onmouseover="MM_nbGroup('over','tab1','images/tab1hover.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="images/tab1hover.gif" alt="Home" name="tab1" width="79" height="31" id="home" onload="MM_nbGroup('init','group1','tab1','images/tab1.gif',1)" /></a>

          <a href="javascript:;" onclick="MM_nbGroup('down','group1','tab2','images/tab2hover.gif',1)" onmouseover="MM_nbGroup('over','tab2','images/tab2hover.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="images/tab2.gif" alt="About Us" name="tab2" width="95" height="31" id="aboutUs" /></a>

          <a href="javascript:;" onclick="MM_nbGroup('down','group1','tab3','images/tab3hover.gif',1)" onmouseover="MM_nbGroup('over','tab3','images/tab3hover.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="images/tab3.gif" alt="Services" name="tab3" width="89" height="31" id="services" /></a>

          <a href="javascript:;" onclick="MM_nbGroup('down','group1','tab4','images/tab4hover.gif',1)" onmouseover="MM_nbGroup('over','tab4','images/tab4hover.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="images/tab4.gif" alt="Testimonials" name="tab4" width="120" height="31" id="testimonials" /></a>

          <a href="javascript:;" onclick="MM_nbGroup('down','group1','tab5','images/tab5hover.gif',1)" onmouseover="MM_nbGroup('over','tab5','images/tab5hover.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="images/tab5.gif" alt="Contact Us" name="tab5" width="108" height="31" id="contactUs"  /></a>        

        </div>

      </div>

    </div>

  </div>

  </div>

  

</body>

</html>

and here is the js code

PHP Code:


			
function MM_preloadImages() { //v3.0

  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

}



function MM_findObj(n, d) { //v4.01

  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

  if(!x && d.getElementById) x=d.getElementById(n); return x;

}



function MM_nbGroup(event, grpName) { //v6.0

  var i,img,nbArr,args=MM_nbGroup.arguments;

  if (event == "init" && args.length > 2) {

    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {

      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;

      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();

      nbArr[nbArr.length] = img;

      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {

        if (!img.MM_up) img.MM_up = img.src;

        img.src = img.MM_dn = args[i+1];

        nbArr[nbArr.length] = img;

    } }

  } else if (event == "over") {

    document.MM_nbOver = nbArr = new Array();

    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {

      if (!img.MM_up) img.MM_up = img.src;

      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);

      nbArr[nbArr.length] = img;

    }

  } else if (event == "out" ) {

    for (i=0; i < document.MM_nbOver.length; i++) {

      img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }

  } else if (event == "down") {

    nbArr = document[grpName];

    if (nbArr)

      for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }

    document[grpName] = nbArr = new Array();

    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {

      if (!img.MM_up) img.MM_up = img.src;

      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;

      nbArr[nbArr.length] = img;

  } }

}

Any help would be greatly appreciated

wirehopper · #2 (**permalink**) 09-27-09, 02:59 PM

This code looks like it was generated by Dreamweaver, and it may not validate.

Does it have to be XHTML strict? If you choose a different standard, it will probably validate.

HTML doctype declaration

Nico · #3 (**permalink**) 09-27-09, 03:37 PM

Remove your onload attribute from the <body> tag and place this in the <head>:

Code:

<script type="text/javascript">
window.onload = function()
{
    MM_preloadImages('images/tab1.gif','images/tab1hover.gif','images/tab2hover.gif','images/tab3hover.gif','images/tab4hover.gif','images/tab5hover.gif');
}
</script>

... and try removing the "name" attributes from your <img> tags. They might be redundant.

wirehopper · #4 (**permalink**) 09-27-09, 07:27 PM

The note about the name attribute is because the id attribute replaces the name attribute in XHTML (XHTML Syntax).

kevinkhan · #5 (**permalink**) 09-28-09, 03:28 AM

Quote:

Originally Posted by Nico

... and try removing the "name" attributes from your <img> tags. They might be redundant.

Iv tryed this but they are required..

Yes this code was produced by dream weaver which probably isnt the best...

Does anyone have a link to where i can find cleaner code and code that will validate as html stict??

Thanks for your help...

wirehopper · #6 (**permalink**) 09-28-09, 06:55 AM

You could just run it through the validator until it validates.

It won't be true Dreamweaver code, but it will be valid.

The errors reported are minor enough that you should be able to get it to validate fairly fast.

The alternative is to hand-code it - don't use Dreamweaver. A good book is HeadFirst HTML/CSS.