Why does the following built-in "OnClick" not work in Chrome when id = "template"?

This is probably something simple, I forget, but my google-fu does not turn anything that could explain the reason. For example, take the following code snippet (ignoring now that embedded js are usually considered bad practice):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html> 
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>
    </title>
</head>
<body> 
    <form action="">
      <div>
        <input type="text" id="pattern" value="foobar">
        <input type="button" value="Alert" OnClick="alert(pattern.value);">
      </div>  
    </form>
</body> 
</html>

The above will give a warning “foobar” in IE8 and Firefox 3, but Chrome will print “undefined”. Changing patternto something else like this pattern_will print "foobar" for all three browsers, as expected.

Is it a patternreserved word or a name used for one of the built-in js libraries? What is the reason for this not working in Chrome?

+3
2

DOM (window). , id="xyz" window.xyz xyz. , Chrome .

SO- , .

[ ] : Chrome (webkit), - , . . quirksmode ( "pattern" , HTML5 pattern input, , )

+4

DOM id. document.getElementById(...), - js-/ (, $('#yourid') jQuery, $('yourid') Prototype ..). - , .

+1

All Articles