Home/ Questions/Q 6015835
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T02:53:37+00:00

This is probably something simple I’m overlooking but my google-fu isn’t turning anything up

  • 0

This is probably something simple I’m overlooking but my google-fu isn’t turning anything up that could explain the cause. Take the following snippet for example (Ignoring for now that embedded js is generally 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 print the alert message ‘foobar’ in IE8 and Firefox 3 but Chrome will print ‘undefined’. Changing pattern to something else like pattern_ will print ‘foobar’ for all three browsers as expected.

Is pattern a reserved word or a name used for one of the builtin js libraries? What’s the reason for this not working under Chrome?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Because internally the mentioned browsers attach DOM elements as Objects to the global namespace (window). So, an object with id="xyz" can also be addressed as window.xyz or even as xyz. I suppose Chrome doesn’t do this.

    Also check my SO-question about this, especially the selected answer.

    [edit] after comment: it’s Chrome (webkit) related indeed and it may have something to do with what I found here. See also quirksmode (search the page for ‘pattern’ it looks like in HTML5 pattern is an attribute of input, so I can imagine that interferes with an id having the same name)

    • 0