`.childNodes`を使ってjavascriptからHTML DOM要素にアクセスする

.childNodesのプロパティについて、私は以下のコードを持っています。何らかの理由で18人の子供がいるのに対し、6人はHTMLInputElementです。 undefined。これは何についてですか？ input要素を効率的に反復処理する方法はありますか？`.childNodes`を使ってjavascriptからHTML DOM要素にアクセスする

<html> 
    <head> 
    <script> 
    window.onload = function(e){ 
     form = document.getElementById('myForm'); 
     alert(form.childNodes.length); 
     for(i=0; i<form.childNodes.length; i++){ 
      alert(form[i]); 
     } 
    } 
    </script> 
    </head> 
    <body> 
<form id='myForm' action="haha" method="post"> 
Name: <input type="text" id="fnameAdd" name="name" /><br /> 
Phone1: <input type="text" id="phone1Add" name="phone1" /><br /> 
Phone2: <input type="text" id="phone2Add" name="phone2" /><br /> 
E-Mail: <input type="text" id="emailAdd" name="email" /><br /> 
Address: <input type="text" id="addressAdd" name="address" /><br /> 
<input type="submit" value="Save" /> 
</body> 
</html>

出典

2012-04-10 Ramzi Kahil

www.jquery.comにアクセスしてください。彼らは非常に良い文書を持っています。また、ステップバイステップのチュートリアルが必要な場合は、単に "jQueryチュートリアル"としてください。そこにLOTSがあります。 – machineghost

form.elementsフォーム内のINPUTの要素を取得するために、すべてのフォームフィールド、またはform.getElementsByTagName('INPUT')を取得するにはform.elementsを使用してフォーム -

window.onload = function(e){ 
     var s='', form = document.getElementById('myForm'), 
     L=form.elements.length; 
     s=L+'\n'; 
     for(var i=0;i<L; i++){ 
      s+= (form[i].name || form[i].id)+'='+form[i].value+'\n'; 
     } 
     alert(s); 
    }

出典

2012-04-10 23:23:50 kennebec

childNodesもテキストノードを返します。これは恐らくあなたの混乱の原因です。

すべてのchildNodesを繰り返し処理するが、INPUTsのみに注意を払うには、ノードのtagNameプロパティをチェックするだけです。ノードがテキストノードの場合、tagNameはありません。ノードにtagNameがある場合は、tagName == "input"かどうかを確認できます。

出典

2012-04-10 23:19:00 machineghost

また、「私は」とは思わないので、代わりに.childrenを使用することもできますが、INPUTだけを取得するには.tagNameを確認する必要があります。または、誰かがコメントしたように（コメントが削除されたかどうかはわかりません）、jQueryを使用できます。 jQueryの式$（ "＃myForm INPUT"）。get（）は、あなたが望むものだけを返します。 – machineghost

私は何を使うことができますか？ –

申し訳ありませんが、より具体的にする必要があります... – machineghost

テキストノードは、空白のみで構成されていても、br要素のように出力に含まれます。

brを含むすべての要素が必要な場合は、代わりに.childrenを使用してください。これにより、要素ノードのみが表示されます。私は古いIEには間違ってコメントノードが含まれていると思いますが、あなたのコードには何もありません。

それとも...

form.getElementsByTagName('input')

を行うことができ...あなただけのinput要素を望んでいたと仮定して。

さらに、あなたはform要素を閉じるのを忘れました。

出典

2012-04-10 23:20:12

私は11人の子供（クロムとIE9） –

@マーティン：私の答えの最新の更新を表示するブラウザを更新します。 –

'element.children'はIE9より古いバージョンのIEではサポートされていないことに注意してください。 –

のすべての要素にアクセスするための簡単な方法です。

出典

2012-04-10 23:24:58

`.childNodes`を使ってjavascriptからHTML DOM要素にアクセスする

答えて

関連する問題