• 締切済み

getElementsByNameの要素数が取得できません。(ソース付)

よろしくお願いします。 getElementsByNameを使って要素数を取得しようとしています。 しかし、tableタグの数が入っていません。 tableタグになる、nameは無効になるのでしょうか？ <html> <head> <title>document.getElementsByName - 指定nameのエレメント全取得</title> </head> <!--指定nameのエレメント全取得のサンプル--> <script type="text/javascript"> function getElements() { var elements = document.getElementsByName("test") alert(elements.length + "個の要素が見つかりました") } </script> </head> <body> <input name="test" type="text"><br> <table name="test"></table><br> <input name="test" type="text"><br> <button onclick="getElements()">getElementsByName('test')</button> </html>

  • XML
  • 回答数4
  • ありがとう数5

みんなの回答

回答No.4

連続回答すみません。 俺が当時回答した2007年時のMDCの資料には https://developer.mozilla.org/index.php?title=En/DOM/Document.getElementsByName&revision=17#Notes >The name attribute is only valid for a limited set of HTML elements, therefore getElementsByName() is only applicable to those elements. name属性は限られたHTMLの要素のセットでのみ有効であり，getElementsByNameの結果もこれらの要素に対してのみ適用される。 (訳注:ただし、当時Firefox自身がこの挙動に沿っていなかった) と書いてあり，見かけたことある文章なので，#2で述べたものだと思います。確かこれを参考に当時回答を書きました。仕様の記述があいまいなため，2008年になってbug 242808で再燃しているんですね。 http://pastaseca.blog119.fc2.com/blog-entry-87.html 回答はうまく返せないけど，回答当時の背景を記述しました。

回答No.3

少なくともMozillaは違う見解を示しているっぽいので少し読みなおしてみる #ちなみに2を返すのはIEだけ https://developer.mozilla.org/en/DOM/document.getElementsByName

回答No.2

Q3598682が出るまで俺も勘違いしていた。 table要素にはname属性がありません。 http://www.w3.org/TR/html401/struct/tables.html#edef-TABLE ちなみにHTML4.01とXHTML 1.0では定義が異なります。 http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-71555259 #Q3598682で回答したときは，HTMLで定義された以外の要素にはマッチしないものだって書いてあったのを見かけた気がするんだけど，今探しても見つからない

  • SAYKA
  • ベストアンサー率34% (944/2776)
回答No.1

そりゃ取れないだろうね nameはdocument内にただ一つでなければならない物で、idとほぼ同等の挙動をするよ。 ただ一つ、と言ってもformの部品の様にグループ化するために同じ物を指定しなければならない場合が有るからgetElement「s」になってるだけだと思う。 body閉じタグが無いのは無視するとしてこの場合は bodyのchildNodesという方法で取得して他の属性を埋め込んでおいて振り分けるしかないね。 どうしても考えるのがめんどいと言うならそういう整形xsltを通してしまうというのもアリだけれどこの分量くらいしか無いようなら返って手間になるだけだからchildNodesで　かな。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. XML

関連するQ&A

  • getElementsByTagName　parentNode.removeChild

    再び同じような質問ですが document.getElementsByTagNameもparentNode.removeChildも、よく使い方がわからずコードを書いています。 下記コードで「消す」を実行させても、半分ずつしか削除されません。 12個から6個、次に3個という具合です。 一度に全部（"input"のみ）削除するには、どうしたらよろしいでしょうか？ <script type="text/javascript"> var gg=[]; function d() { elements = document.getElementsByTagName("input"); alert(elements.length + "個の要素が見つかりました") } function del() { gg = document.getElementsByTagName("input"); for(i=0;i<gg.length;i++) 　 gg[i].parentNode.removeChild(gg[i]); } </script> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <input name="test" type="text"><br> <br> <button onclick="d()">個数</button> <button onclick="del()">消す</button>

  • 同名ボタンのクリック時要素番号の取得方法

    <html> <head> <script Language="JavaScript"><!-- function doSentaku(btn) { //クリックされたボタンの要素番号が知りたい alert(btn.name); } // --></script> </head> <body> <form name="mainWin"> <input type="button" value="配列ボタンテスト1" name="testbtn" onClick="javaScript:doSentaku(this)"><br> <input type="button" value="配列ボタンテスト2" name="testbtn" onClick="javaScript:doSentaku(this)"><br> <input type="button" value="配列ボタンテスト3" name="testbtn" onClick="javaScript:doSentaku(this)"><br> </form> </body> </html> ----------------------------------------------------------------------------------------- このようなFromがあった場合、nameが同じである時、javaScriptではボタンのElemetは配列扱いになるかと思うのですが、doSentaku関数内ではnameは取得できるとして、クリックされた要素番号は取得できるのでしょうか？ なお、訳ありでdoSentaku関数のボタンonClickの関数引数はすべて同じ定義しかできないものとします。 つまり個々ボタンを識別する値は指定できないと言うことです。 まことに申し訳ありませんが、どうかアドバイスのほどよろしくお願いします。

  • getElementsByNameで要素が取得できない

    久々にJavaScriptを組みました。 以下のソースコードなんですが、ボタンクリック時にalertで「1」 が表示されるはずだと思っているのですが、「0」が返ってきます。 何かおかしなところはありますでしょうか？宜しくお願いします。 <html> <head> <script language="javascript"> function test(){ var obj = document.getElementsByName("name1"); alert(obj.length); } </script> </head> <body> <div name="name1"></div> <button onclick="test();">TEST</button> </body> </html>

  • select要素のvalueを配列で取得したいです

    select要素のvalueを配列で取得したく、下記のサンプルを動かそうと試みました。 <html> <head></head> <body> <form> <!-- ここに<select name="c1">～<select name="c20">の20個のselectがあるとする --> </form> <input type="button" value="はい" onclick="test(this.form)"> <script type="text/javascript"> function test ( form ) { var values = new Array(); for ( var i=0; i < 20; i ++ ) { var elm = form.elements['c'+i]; values[i] = elm.options[elm.selectedIndex].value; } } </script> </body> </html> このようなサンプルを動かそうとしたのですが、 var elm = form.elements['c'+i];のところの['c'+i]が正しくないようで 「elm is underfind」というエラーが出てしまいます <script> function myForm (form) { var values = new Array(); for ( var i=0; i<20; i++ ) { var elm = form.elements[i]; values[i] = elm.options[elm.selectedIndex].value; document.write(values[i] + "<br />"); } } </script> インデックス名を'c'+iからiにすると取得できるのですが、 ブラウザが読み込みをやめない状態になってしまいます。 select要素のnameはc1から始まりc20と何も換えていません。 何が間違っているのでしょうか。

  • 現在のカーソル行を知りたい。

    'KeyDown'の下記サンプルコードでfunction msgにきたときに 何番目のテキストボックスでKYyDownされたか知りたいのですが、 関数があればお教え下さい。 <html> <head> <script type="text/Javascript"> <!-- function msg(str) { alert("check"); } //--> </script> </head> <body onKeyDown="msg('KeyDown')"> key<br> <form name="myForm" method="POST" target="_self"> <input type="text" name="text1><BR> <input type="text" name="text1"><BR> <input type="text" name="text1"><br> <input type="submit" name="button1" value="button"> </form> </body> </html>

  • メールフォームのソースについて

    メールフォームがうまく作れません。下のソースでおかしなところがあったら 教えていただけませんか？よろしくお願いします。 html> <head> <title>sample</title> <script Language="JavaScript"><!-- function set(sObj) { str = sObj.options[sObj.selectedIndex].value; document.myFORM.action = "mailto:" + str; } // --></script> </head> <body> <form name="myFORM" method="post" action="mailto:abc@***.ne.jp" enctype="text/plain"> <br> <input type="text" value="test" NAME="data"><br> <input type="submit" VALUE="送信"><br> </form> </body> </html>

  • TABLEタグ内に入った項目の座標取得について

    オブジェクトの座標位置を取得する"offsetTop"はTABLEタグ内のものには使えないとありました。 （参考質問URL：http://oshiete1.goo.ne.jp/kotaeru.php3?q=1556067） 参考URLの回答例を見ながら、簡単なソースを組んでみたのですが、結果が「0」となってしまい値がとれていません。 （TABLEタグにはいっていなければ取得できます） 何がいけなくてこうなってしまっているのかわからず、大変悩んでいます。 お分かりになられる方、ご教授お願いいたします。 (文字数制限の関係で、インデントがとれてません。みにくくてごめんなさい) <xmp> <html> <head> <script language="JavaScript" type="text/javascript"> <!-- function absOffsetTopR(el){ if(el.offsetParent.tagName.toLowerCase()=="body"){ return el.offsetTop; }else{ return el.offsetTop+absOffsetTopR(el.offsetParent); } } function absOffsetTop(id){ var el=document.getElementById(id); if(el.offsetParent.tagName.toLowerCase()=="body"){ return el.offsetTop; }else { return absOffsetTopR(el); } } //--> </script> </head> <body> <form name="fm_test"> <table name="testTable" border="1" width="150"> <tr> <td align="center"> <input type="text" size="20" name="testText"> <script language="JavaScript" type="text/javascript"> <!-- zahyo = absOffsetTop("testText"); document.fm_test.elements["testText"].value=zahyo; //--> </script> </td> </tr> </table> </form> </body> </html> </xmp>

  • ループで連続したフォームの値を読み込む

    こんにちは ループで苦労しています。 nameが数字で連続したフォームがいくつかあり、それをループで読み取りたいのです。私が作ったものは以下のものです。でもエラーになります。どこが悪いのかどなたかご教授ください。 <script> function ggo(){ for (i=1; i<=3; i++){ document.write(document.forms["myFORM"].elements["k"+i].value); }} </script> <form name="myForm"> <input type="text" name="k0"><br> <input type="text" name="k1"><br> <input type="text" name="k2"><br> <input type="button" value="hai" onClick="ggo()"> </form> それから、余談ですが以下のスクリプトはループを１回にするとkipをエラー無しで読み込んでくれますが、２回以上にするとエラー表示とともに１度しか読み込んでくれませんなぜなのでしょうか？ひとつの書き込みにに１つの質問が原則なのでこちらの質問に答えていただける方がいらっしゃればそれもとてもありがたいです。欲張ってすいません。 <script> function ggo(){ for (i=0; i<=2; i++){ document.write(document.myForm.kip.value); } } </script> <form name="myForm"> <input type="text" name="kip"><br> <input type="button" value="hai" onClick="ggo()"> </form> ↓参照しました↓ http://oshiete1.goo.ne.jp/qa820843.html

  • body内で<script>の位置のオブジェクトを取得する方法

    javascriptで、下記状況でNode(もしくはObject)を取得する方法がないか探しています。 body内の所定の場所に、<script>タグによりJavaScriptが記述されており、 その<script>タグ内で、<input>を生成しそれに対しイベントの追加や所定の処理を行いたいのです。 例)-------------------------------------------------- <body> <input type="text" value=""> <script type="text/javascript"> /* ここで、inputを生成後そのObjectに対して処理を行うため、 inputのオブジェクトをnameやidを使わず取得したい。 */ </script> <input type="text" value=""> </body> -------------------------------------------------- document.writeでinputの生成はできますが、目的に合わないかなと思っています。 理由として、厳密にObjectは取得できない場合があると考えています。 document.write("<input type='button' name='hoe'..."); document.getElementsByName("hoe"); と行えば取得できるとおもいますが、nameでは重複しているときに、処理の対象が特定できない(と思っている)ためです。 idも、処理のためだけにid付するのは、避けたいなと考えています。 そこで、<script>の位置（もしくは親）のnodeを取得できれば,そこからappend出来る可能性があると、発想したのですが、その方法が分からず詰まってしまいました。 (対象ブラウザIE6以降) <body>内の<script>位置のnodeを取得する方法か、別の発想で上記を実現できる方法があれば、教えてください。

  • Enterキーでボタンが押下＆新しいタブで開くには

    こちらで教えていただきながら、下記のようなhtml文にたどり着きました。 加えて以下のことをしたいと思っており、解説を読みながらいろいろ試していますがうまくいきません…。 (1)テキストボックスに文字を入力した後、Enterキーでボタンが押下されるようにしたい (2)結果の画面を新しいタブで表示したい （head部分に<base target="_blank">と記述してもでダメでした） 上記2つのことが出来るようでしたら、その方法を教えていただけないでしょうか。 どうぞよろしくお願いいたします。 -------------------------------------------- <html> <head> <script type="text/javascript"> <!-- function jump1(){ location.href="http://minkabu.jp/stock/" + document.getElementsByName("code1")[0].value; } function jump2(){ location.href="http://kabu-sokuhou.com/brand/item/code___" + document.getElementsByName("code2")[0].value; } //--> </script> <base target="main"> </head> <body> <form> <input name="code1" size="4" > <br><br> <input type="button" onclick="jump1()" value="サイト１へ"> </form> <form> <input type="hidden" name="code2" size="4"> <input type="button" onclick="jump2()" value="サイト２へ"> </form> </body> </html> -----------------------------------------------------

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する