Log in

View Full Version : validator error for </div> in any link drop down menu


vas
03-09-2007, 02:04 AM
1) Script Title: Anu Link drop down menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/dropmenuindex.htm

3) Describe problem: I try to validate the html in which the script embedded. here is what i get for the following section of the code.


if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')





Error Line 236 column 184: end tag for element "DIV" which is not open.

...onMouseout="dynamichide(event)"></div>')

The Validator found an end tag for the above element, but that element is not currently open. This is often caused by a leftover end tag from an element that was removed during editing, or by an implicitly closed element (if you have an error related to an element being used where it is not allowed, this is almost certainly the case). In the latter case this error will disappear as soon as you fix the original problem.

If this error occured in a script section of your document, you should probably read this FAQ entry.



In the FAQ entry it says
The validator complains about something in my JavaScript!

Most probably, you should read the script section of WDG's excellent Common HTML Validation Problems document.
Why doesn't the validator like my <link ... /> or <meta ... />?

HTML is based on SGML and uses an SGML feature (called SHORTTAG) (note that this is not the case with XHTML).

With this feature enabled, the "/" in <link ... /> or <meta ... /> already closes the link (or meta) tag, and the ">" becomes some regular text, which is not allowed in the <head> element. Since </head><body> is optional in HTML (again, not in XHTML), it is silently inserted, thus head-only elements like meta and style as well as "</head>" and "<body>", which may appear only once, become false.

Is there any way to solve the issue?

actually it showed 41 other errors related to the following


menu3[14]='<a href="mailto:starf1@mail.com" class="mainmenu"><img src="images/favicons/contact.png" border="0" height=16 width=16 alt="Contact">&nbsp;Contact</a>'


I removed the </a> and it is working fine.

But when I removed the </div> it validated with 0 errors but send a blank web page with only drp down timer visible in the opera browser.

could you please tell me a way out to validate the script.

Thanks in advance.
jscheuer1
03-09-2007, 04:24 AM
There are two ways around the problem. The recommendation is to make the script external. That works but, can sometimes be undesirable for whatever reason. You can also simply escape the / with a \, examples:


<\/div>


if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"><\/div>')

This is only applicable when the closing tag in question is or is a part of a javascript string. It is in this case and, in fact almost always is when the validator takes this type of exception to it.
vas
03-09-2007, 05:58 AM
Thanks it works.

Intially I gave a space between \ and / So it did not work.

But then after removing the gap it works fine.

Thank You very much.
tech_support
03-09-2007, 06:02 AM
Try instead of this:


if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"><\/div>')

put this:



if (ie4||ns6) {
var e = document.createElement('div')
e.setAttribute('id','dropmenudiv')
e.setAttribute('style','visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor)
e.setAttribute('onMouseOver','clearhidemenu()')
e.setAttribute('onMouseout','dynamichide(event)')
document.body.appendChild(e)
}
vas
03-09-2007, 07:02 AM
put this:



if (ie4||ns6) {
var e = document.createElement('div')
e.setAttribute('id','dropmenudiv')
e.setAttribute('style','visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor)
e.setAttribute('onMouseOver','clearhidemenu()')
e.setAttribute('onMouseout','dynamichide(event)')
document.body.appendChild(e)
}


I used the above in an another style and it also passed validation. Will the above code increase the processing time? than the one with <\/div> ?
tech_support
03-09-2007, 07:05 AM
No, it won't increase the processing time (You won't notice it)
jscheuer1
03-09-2007, 07:08 AM
But, it may create problems in some browsers. It may not. Using the DOM as a substitute for document.write has proven in some cases to mess up scripts in IE. I have no idea about this particular case.
tech_support
03-09-2007, 07:10 AM
Hmm....

How about



document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"><'+/div+'>')

?
jscheuer1
03-09-2007, 07:45 AM
That would need to be (to work as javascript):


<'+'/div'+'>'

and you would just have to run it through the validator to see what it thinks of it.