Javascript Validation w3c

Question

I'm trying to show/hide content in the following doctype: !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

Here's my javascript:

<script type="text/javascript"> function question(clicked) {
      var q = document.getElementsByTagName("div");
      for(var x=0; x<q.length; x++) {
            title = q[x].getAttribute("title");
            if (title == 'q') {
                  if (q[x].id == clicked) {
                        if (q[x].style.display == 'block') {
                              q[x].style.display = 'none';
                        }
                        else {
                              q[x].style.display = 'block';
                        }
                  }else {
                        q[x].style.display = 'none';
                  }

           }
      } } </script>

On Validation, it returns these errors: 1. Error Line 9, Column 30: character ";" not allowed in attribute specification list

        for(var x=0; x<q.length; x++) {

Error Line 9, Column 30: element "q.length" undefined
```
    for(var x=0; x<q.length; x++) {
```
Error Line 25, Column 9: end tag for "q.length" omitted, but OMITTAG NO was specified
Info Line 9, Column 21: start tag was here
```
    for(var x=0; x<q.length; x++) {
```

I'm learning Javascript now, and have tried to Google & fix this about 3 dozen ways by now. Can anyone help me? If I need to try a different script to show/hide, at this point, I'd scrap what I have and do it.

Thanks in advance!

Where in your page are you putting that <script> block? It feels to me that it's trying to interpret your JavaScript as XHTML: "end tag for q.length omitted" is a strange one. The JavaScript itself seems perfectly valid. — Cᴏʀʏ
– Cᴏʀʏ, Commented Nov 5, 2011 at 18:19
This isn't directly related to your question, but you should use q[x].style.display = ''; instead of ='block'; This is because not all elements start out as block, so by setting them to block you're potentially messing up how they display. Setting their display to an empty string sets them back to their default value. — machineghost
– machineghost, Commented Nov 5, 2011 at 18:19
@Cory It's in the <head> section of my page. Thanks for your help. — Petrie
– Petrie, Commented Nov 5, 2011 at 18:36

Rob W · Accepted Answer · 2011-11-05 18:37:41Z

6

Use CDATA sections. The < has a special meaning for the parser.

<script>
//<![CDATA[
 ...JavaScript code..
//]]></script>

The validator has detected a <, and attempts to parse a new tag <q.length. When the semicolon is spotted, the parser don't know how to handle it, and throws an error. By using CDATA, you effectively say "Anything inside this section should be interpreted as plain-text, and not be parsed.

Paste your code at http://validator.w3.org/check (validate by direct input), using the following settings: "Validate Document fragment, XHTML 1.0".

edited Nov 5, 2011 at 18:37

answered Nov 5, 2011 at 18:16

Rob W

350k87 gold badges811 silver badges683 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Petrie Over a year ago

Thanks for the answer! Unfortunately, it didn't seem to do it.. Should I be reducing the <script type="text/javascript"> to just <script>?

Petrie Over a year ago

Nope, needs the type attribute. Now the w3c validator doesn't like the < and > characters in the CDATA tag, and still wants me to get rid of the semicolon and < in x=<q.length.

Rob W Over a year ago

I have accidentally omitted the !. Try again, using the steps in my answer (at validator.w3.org/check).

Petrie Over a year ago

Thank you! Both your answer and @Kris C's worked. Much appreciated!

Kris C · Accepted Answer · 2011-11-05 18:40:33Z

2

If you move your javascript functions into an external file, and then link to that file from your page head section, then the validator doesn't have to worry about them.

e.g.

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

This also allows you to reuse functions across multiple pages without repeating the code.

A further benefit is that the user's browser will cache the js file the first time it encounters it, so on subsequent pages the javascript functions file will be retrieved from cache, rather than being downloaded with the page.

edited Nov 5, 2011 at 18:40

answered Nov 5, 2011 at 18:32

Kris C

2,8681 gold badge29 silver badges25 bronze badges

Collectives™ on Stack Overflow

Javascript Validation w3c

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related