Chris
Chris

Reputation: 27384

W3 xHTML Validation Errors on jQuery code!

I have some jQuery code that, without it in the document it passes validation fine, but with it in it causes errors. The code in question is here:

    $.ajax({
        type: "GET",
        url: "data.xml",
        dataType: "xml",
        success: function(xml) {

            //Update error info
            errors = $(xml).find("Errors").find("*").filter(function ()
            {
                return $(this).children().length === 0;
            });

            if (errors.length == 0)
            {
                statuscontent = "<img src='/web/resources/graphics/accept.png' alt='' /> System OK";
            }
            else
            {
                statuscontent = "<img src='/web/resources/graphics/exclamation.png' alt='' /> "+errors.length+" System error"+(errors.length>1?"s":"");
            }

            $("#top-bar-systemstatus a").html(statuscontent);

            //Update timestamp
            $("#top-bar-timestamp").html($(xml).find("Timestamp").text());

            //Update storename
            $("#top-bar-storename").html("Store: "+$(xml).find("StoreName").text());
        }
    });

There are loads of other jQuery code on the page which all works fine and causes no errors so I cannot quite understand what is wrong with this. The page isn't "live" so cannot provide a link to it unfortunately.

The error it lists is

document type does not allow element "img" here

And the line of code it points to is here:

 statuscontent = "<img src='/web/resources/graphics/accept.png' alt='' /> System OK";

It also has an issue with the next assignment to statuscontent

Upvotes: 2

Views: 1106

Answers (2)

user142019
user142019

Reputation:

It's because you are using XHTML. This is invalid indeed as the validator acts as if the code between the script tags is XML (XHTML is a subset of XML). This is invalid XHTML, as img-tags don't belong inside of script-tags.

To make it validate, use CDATA to escape any XML within your script.

<script type="text/javascript">
// <![CDATA[

... your code
// ]]>
</script>

In HTML 5 this is not an issue. If you make a new website I'd recommend HTML 5 over XHTML. Use XHTML only if you are modifying an existing website.

Upvotes: 8

Quentin
Quentin

Reputation: 943547

See Script and Style Elements in The Differences From HTML 5.

Next see the comparable section in the XHTML Media Types document since you are almost certainly serving your XHTML as HTML for IE compatibility.

(Then you'll probably do what I did back in '99 which is to throw you hands up in the air, scream "What's the point of using XHTML if I have to pretend it is HTML?!" and run back to HTML 4.01. (Or possibly onto HTML 5))

Upvotes: 1

Related Questions