6

javascriptだけを使用して、名前属性が特定の値で終わる入力要素を取得するにはどうすればよいですか?

この$('input[name$="value"]')メソッドはjQueryで利用できることがわかりました。

JavaScriptで利用できるような機能はありますか?jQueryがなぜか使えません。

4

4 に答える 4

24

これについてまだ誰も言及していないことに驚いています。やってみました:

var elements = document.querySelectorAll('input[name$="value"]');

これは、ブラウザがquerySelectorAllメソッドをサポートしている場合にのみ機能しますが、サポートが見つかった場合、jQuery がその下で使用するものです。

メソッドのブラウザー サポートを一覧表示する表を次に示します。

querySelector/querySelectorAll はいつ使用できますか?

于 2012-04-26T14:16:54.727 に答える
3

<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

詳細については、この記事をよく読んでください。

于 2012-04-26T18:18:02.767 に答える
3

あなたはこれを行うことができます:

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);
于 2012-04-26T14:13:51.880 に答える
-1

このメソッドは要素の配列を返します

var elements = document.getElementsByName("value");
于 2012-04-26T14:13:44.883 に答える