• 締切済み

HTMLタグのidにaaaという名をつけると、Javascriptのf

HTMLタグのidにaaaという名をつけると、Javascriptのfunctionで aaaという関数を作成してそれを呼んだときにnot foundとなるのは何故でしょうか?

みんなの回答

回答No.2

どんなブラウザでnot foundというエラーが出たのか、 またその現象が確認できるコードを補足して下さい。 id="aaa"をどのように扱うかは、現状ではブラウザ依存です。 最新ブラウザでは、FirefoxはJavaScriptに関与しない、それ以外のブラウザは変数名として扱えるようになっています。 (詳しい仕様についてはNo.1参照でお願いします) function aaa(){}とvar aaa=function(){}はほぼ同じ意味で、どちらも変数aaaとして扱えますので、 それがid="aaa"と競合することがあります。

  • think49
  • ベストアンサー率59% (285/482)
回答No.1

id="aaa" な要素が定義されると、window.aaa (グローバル変数aaa) に該当する要素ノードが格納されます。 --- 6.2.4 Named access on the Window object window[name]  Returns the indicated element or collection of elements. The Window interface supports named properties. The names of the supported named properties at any moment consist of: ・the value of the name content attribute for all a, applet, area, embed, form, frame, frameset, iframe, img, and object elements in the active document that have a name content attribute, and ・the value of the id content attribute of any HTML element in the active document with an id content attribute. http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#named-access-on-the-window-object --- ただ、この動作を踏まえた上でも、再現できません。(Google Chrome 5, IE8 で検証) (※以下、全角空白を半角空白に置換してください。) --- <!DOCTYPE html> <html lang="ja"> <head>  <meta charset="UTF-8" />  <title>HTML5</title> </head> <body> <p id="aaa">HTMLParagraphElement</p> <form name="tform"><p><input type="text" name="nickname" /></p></form> <p><iframe name="tiframe"></iframe></p> <p><img name="timg" src="./test.png" alt="test" /></p> <p><a name="ta" href="#ta">HTMLAnchorElement</a></p> <script><!-- alert(aaa.toString());   // [object HTMLParagraphElement] alert(tform.toString());  // [object HTMLFormElement] alert(tiframe.toString()); // [object DOMWindow] alert(timg.toString());  // [object HTMLImageElement] alert(ta.toString());   // Google Chrome 5 = Uncaught ReferenceError: ta is not defined / IE8 = http://example.com/index.html#ta //--></script> <script><!-- alert(aaa.toString()); // function aaa () { alert('aaa'); } aaa();         // aaa function aaa () { alert('aaa'); } //--></script> </body> </html> --- 関数定義前に aaa を呼び出せば、確かに aaa(); は実行されません。 しかし、上のscript要素内ではまだ関数定義される前ですのでa要素ノードが呼び出されるのは当然のことで、関数定義される下のscript要素内では確かに aaa(); が実行されます。 id="aaa" な要素があるかどうか、が原因ではないように思えます。 そもそも、上のケースでは「not found」にはなりませんので見当違いの回答かもしれません。 「not found」というエラーメッセージも見覚えがないので…。 「正確なエラーメッセージ」と「再現可能なコード」を貼り付けてもらえれば、適切な回答がもらえるかもしれません

関連するQ&A