Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    mypointofview
    Guest

    All lower case in XHTML -- really "all" ?

    Very quick question: if I want to write my code future proof, hence all in lower case for XHTML, must I also write then in lower case things like "onMouseover" or "onClick" ?
    Last edited by mypointofview; 05-22-2007 at 10:49 PM.

  • #2
    Senior Coder
    Join Date
    Jul 2005
    Location
    UK
    Posts
    1,051
    Thanks
    6
    Thanked 13 Times in 13 Posts
    No, I believe JavaScript is exempt from the lowercase rule since technically speaking it's not actually HTML...

  • #3
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    onMouseover and onClick are event handlers. They are not considered javascript so yes they must be lowercase as well.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #4
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Quote Originally Posted by _Aerospace_Eng_ View Post
    onMouseover and onClick are event handlers. They are not considered javascript so yes they must be lowercase as well.
    Hi!

    http://www.notetab.com/?NoteTab%20Light=4950

    This free utility will seek out incorrect case and correct it.

    effpeetee

  • #5
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,620
    Thanks
    0
    Thanked 645 Times in 635 Posts
    JavaScript is case sensititve the same as XHTML.

    onmousdeover and onclick are JavaScript and JavaScript requires that they be in all lowercase.

    For example window.onload is valid while window.onLoad is not.

    The only reason you can get away with random capitals in the names in HTML is that HTML is not case sensitive.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #6
    mypointofview
    Guest
    Yes, I realized too, that when I made to lower case the code inside the quotes (the real javascript function) then the script would not run if it was otherwise before. Putting the handler (onclick) in lower case as required by XHTML did not affect the script though.

    Thanks for shedding light on this !
    Last edited by mypointofview; 05-22-2007 at 10:49 PM.

  • #7
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Quote Originally Posted by mypointofview View Post
    Very quick question: if I want to write my code future proof, hence all in lower case for XHTML, must I also write then in lower case things like "onMouseover" or "onClick" ?
    ALL attributes in XHTML must be written in lowercase.

    Youíll find that a lot of things in XHTML demand lowercase, including the ďxĒ in the hexadecimal character reference   and the values for the type attribute of the input element. The exception is the document type declaration, which takes uppercase terms.

    Quote Originally Posted by Pennimus View Post
    No, I believe JavaScript is exempt from the lowercase rule since technically speaking it's not actually HTML...
    Quote Originally Posted by felgall View Post
    onmousdeover and onclick are JavaScript and JavaScript requires that they be in all lowercase.
    The XHTML onmouseover and onmouseout attributes are not part of JavaScript. The case is defined entirely by the XHTML DTD.

    Quote Originally Posted by mypointofview View Post
    Putting the handler (onclick) in lower case as required by XHTML did not affect the script though.
    If youíre using HTML, this behavior is correct since HTML is case insensitive.

    If youíre serving XHTML as HTML, the XHTML is treated as HTML, so the behavior will probably be identical (to that of HTML) in modern browsers. You should not be serving XHTML as HTML though; either use real XHTML or use HTML. The former is not likely to be an option since Internet Explorer doesnít support the real thing.

    As you can see from a live example, the case does matter in a real XHTML document.

    Code from the live example for future reference (forgot to add this previously):
    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" [
    	<!ATTLIST div onClick CDATA #IMPLIED>
    	]>
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-Latn-US">
    	<head>
    
    		<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
    		<meta http-equiv="Content-Script-Type" content="application/ecmascript"/>
    		<title>Demo CF114619</title>
    		<meta name="Author" content="Patrick Garies"/>
    		<meta name="Created" content="2007-05-22"/>
    		<style type="text/css">
    			* { margin: 0; padding: 0; }
    			html { background: white; color: black; }
    			p, div { margin: 1em; padding: 1em; background: #eee; }
    			div:hover { background: #ddd; cursor: pointer; }
    		</style>
    
    	</head>
    	<body>
    
    		<p>Click each of the two below <code>div</code> elements to see if the event is triggered.</p>
    		<div onclick="if (!this.firstChild.nextSibling) { this.appendChild(document.createTextNode(' works!')); }"><code>onclick</code></div>
    		<div onClick="if (!this.firstChild.nextSibling) { this.appendChild(document.createTextNode(' works!')); }"><code>onClick</code></div>
    	
    	</body>
    </html>
    Last edited by Arbitrator; 05-23-2007 at 01:36 AM. Reason: I added the code.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #8
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,630
    Thanks
    6
    Thanked 1,002 Times in 975 Posts
    Quote Originally Posted by Arbitrator View Post
    As you can see from a live example, the case does matter in a real XHTML document.
    And in a real XHTML document this is pretty much irrelevant:
    Code:
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
    Öas the MIME type can only be sent in the HTTP headers by the server, and canít be faked with meta tags (and the character encoding is specified in the xml statement at the top).

  • #9
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Quote Originally Posted by VIPStephan View Post
    And in a real XHTML document this is pretty much irrelevant:
    Code:
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
    Öas the MIME type can only be sent in the HTTP headers by the server, and canít be faked with meta tags (and the character encoding is specified in the xml statement at the top).
    Practically speaking, youíre correct. In theory though, a server would read that and use it to set an equivalent HTTP header. Itís not an issue here though since Iím not really relying on it to specify the media type (file extension) or the character encoding (XML declaration).

    I am curious if itís possible to get PHP to read the documentís meta elements and set the headers accordingly though. Unfortunately, Iím still a newbie with that and havenít figured out how to read the current document through the DOM or if itís even possible; I can only figure out how to import content from another document.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #10
    Senior Coder koyama's Avatar
    Join Date
    Dec 2006
    Location
    Copenhagen, Denmark
    Posts
    1,246
    Thanks
    1
    Thanked 5 Times in 5 Posts
    Quote Originally Posted by Arbitrator View Post
    I am curious if itís possible to get PHP to read the documentís meta elements and set the headers accordingly though. Unfortunately, Iím still a newbie with that and havenít figured out how to read the current document through the DOM or if itís even possible; I can only figure out how to import content from another document.
    Just for your information (maybe you already know), it would look like this in php:
    PHP Code:
    <?php
    header
    ("Content-Type: application/xhtml+xml; charset=UTF-8");
    header("Content-Script-Type: application/ecmascript");
    echo 
    '<?xml version="1.0" encoding="UTF-8"?>' "\n";
    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" [
        <!ATTLIST div onClick CDATA #IMPLIED>
        ]>

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-Latn-US">
        <head>
            <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8"/>
            <meta http-equiv="Content-Script-Type" content="application/ecmascript"/>
            <title>Demo CF114619</title>
            <meta name="Author" content="Patrick Garies"/>
            <meta name="Created" content="2007-05-22"/>
            <style type="text/css">
                * { margin: 0; padding: 0; }
                html { background: white; color: black; }
                p, div { margin: 1em; padding: 1em; background: #eee; }
                div:hover { background: #ddd; cursor: pointer; }
            </style>

        </head>
        <body>

            <p>Click each of the two below <code>div</code> elements to see if the event is triggered.</p>
            <div onclick="if (!this.firstChild.nextSibling) { this.appendChild(document.createTextNode(' works!')); }"><code>onclick</code></div>
            <div onClick="if (!this.firstChild.nextSibling) { this.appendChild(document.createTextNode(' works!')); }"><code>onClick</code></div>
        
        </body>
    </html>
    If your host supports PHP, you can copy the above into a file with a .php extension and upload it. Indeed, one may check with the Live HTTP headers extension in Firefox that the correct headers are being set. Note that in the above code we have explicitly echoed the <?xml ...?> portion. This is necessary when short opening tags are enabled in php. Otherwise PHP will recognize the <? as the beginning of a PHP script.

    Usually one uses PHP to brutally output the document as one long text stream. One may compare it to using document.write in JavaScript. I know that PHP has some DOM functions that allow you to operate on XML documents in an object oriented way, but I haven't tried those features.

    By the way, I was wondering why Firefox marks up that document type in red when you say View > Page Source ? Is there an error? I have no idea.
    Last edited by koyama; 05-23-2007 at 04:02 AM. Reason: typo


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •