javascriptだけを使用して、名前属性が特定の値で終わる入力要素を取得するにはどうすればよいですか?
この$('input[name$="value"]')
メソッドはjQueryで利用できることがわかりました。
JavaScriptで利用できるような機能はありますか?jQueryがなぜか使えません。
javascriptだけを使用して、名前属性が特定の値で終わる入力要素を取得するにはどうすればよいですか?
この$('input[name$="value"]')
メソッドはjQueryで利用できることがわかりました。
JavaScriptで利用できるような機能はありますか?jQueryがなぜか使えません。
これについてまだ誰も言及していないことに驚いています。やってみました:
var elements = document.querySelectorAll('input[name$="value"]');
これは、ブラウザがquerySelectorAll
メソッドをサポートしている場合にのみ機能しますが、サポートが見つかった場合、jQuery がその下で使用するものです。
メソッドのブラウザー サポートを一覧表示する表を次に示します。
<input>
これらの要素を(要素内の)属する場所に配置したと仮定します<form>
。
DOM APIを介してフォームコントロールをトラバースする最も簡単な方法は、を使用することです。名前付きトラバーサルが可能で、特定の要素に非常に便利です。HTMLFormElement::elements
HTMLCollection
たとえば、次のマークアップについて考えてみます。
<form action="./" method="post" name="test"
onsubmit="return false;">
<fieldset>
<legend>Test Controls</legend>
<input name="control_one" type="text"
value="One">
<input name="control_two" type="text"
value="Two">
<input name="control_three" type="text"
value="Three">
</fieldset>
</form>
その後、いくつかの簡単なドキュメントツリートラバーサルが必要です。全体は次のとおりです。
var test = document.forms.test,
controls = test.elements;
function traverseControl(control)
{
var patt = /one$/,
match = patt.test(control.name);
if (match) {
// do something
console.log(control);
}
}
function traverseControls(nodes)
{
var index;
if (typeof nodes === "object" &&
nodes.length) {
index = nodes.length - 1;
while (index > -1) {
traverseControl(
nodes[index]
);
index -= 1;
}
}
}
traverseControls(controls);
ご覧のとおり、それほど難しくはありません。sを使用することの結果HTMLCollection
は、新旧のブラウザのサポートです。HTMLCollection
はDOM0で実装されているため、広くサポートされています。
将来的には、はるかに曖昧さの少ないトラバーサルを使用することをお勧めします。name
トラバースされるドキュメントツリーを制御している場合(つまり、マークアップを作成した場合)、コントロールのsをすでに知っている必要があります。それ以外の場合は、前述のようなあいまいなアプローチを使用する必要があります。
実例: http: //jsbin.com/epusow
詳細については、この記事をよく読んでください。
あなたはこれを行うことができます:
console.log(document.getElementsByName("value")[0]);
input
または、名前に「値」が含まれる最初の要素を見つけたい場合は、次のようにします。
var searchString = "value";
var elems = document.getElementsByTagName('input'), wantedElem;
for(var i = 0, len = elems.length; i < len; i++) {
if(elems[i].name.lastIndexOf(searchString) == elems[i].name.length-searchString.length) {
wantedElem = elems[i];
break;
}
}
console.log(wantedElem);
このメソッドは要素の配列を返します
var elements = document.getElementsByName("value");