Question

我已经看到它的jquery等价物了：

$('input[value="something"]');

但是如何使用纯javascript（没有jQuery）选择它。

感谢目前为止的所有回复，但我确定它是否正常工作，我需要将输入的值更改为其他内容。我虽然可以通过

来做到这一点

<enter snippet to select element here>.value = "someOtherValue";

但似乎并不那么容易。任何想法。

Answer 1

使用ie6-ie7-ie8

function getInputsByValue(value)
{
    var allInputs = document.getElementsByTagName("input");
    var results = [];
    for(var x=0;x<allInputs.length;x++)
        if(allInputs[x].value == value)
            results.push(allInputs[x]);
    return results;
}

使用现代浏览器ie9 +（实际上对于ie9不确定）：

document.querySelectorAll("input[value=something]");

Answer 2

您可以在现代浏览器（https://developer.mozilla.org/En/DOM/Document.querySelectorAll）上使用document.querySelectorAll()，例如

var byValue = document.querySelectorAll('input[value="something"]');

对于旧版浏览器，您必须遍历input并检查值，例如

var inputs = document.getElementsByTagName("input"),
    i,
    len,
    byVal = [],
    value = "something";

for (i = 0, len = inputs.length; i < len; i++) {
    if (inputs[i].value === value) {
        byVal.push(inputs[i]);
    }
}

Answer 3

var elems = [].filter.call( document.getElementsByTagName("input"), function( input ) {
    return input.value === "something";
});

http://jsfiddle.net/ts2Rr/3/

Answer 4

这样的工作：

function getCheckboxByValue(v) {
        var inputs = document.getElementsByTagName('input');
        for (var i = 0; i < inputs.length; i++) {
                if(inputs[i].type == "checkbox" && inputs[i].value == v) {
                        return inputs[i];
                }
        }
        return false;
}
(function testCheckbox() {
        getCheckboxByValue("1").checked = true;
})();

但是，使用jQuery会好得多。

Answer 5

这样的事情应该有用......

for(i in document.getElementsByTagName('input')) {
   if(i.value == 'desiredValue') {
      return i;
   }
}

编辑：这将返回所有匹配的数组

var matches = [];
for(i in document.getElementsByTagName('input')) {
   if(i.value == 'desiredValue') {
      matches.push(i);
   }
}

Answer 6

在大多数情况下可能，但另一种方法是使用document.evaluate和XPath表达式按值选择输入字段：

let result = document.evaluate(
  '//input[@value="something"]',
  document,
  null,
  XPathResult.ANY_TYPE,
  null
).iterateNext();

result.value = 'someOtherValue';

注意： Internet Explorer不支持此方法。

否则，请使用其他提到的方法之一，以获得更好的浏览器兼容性和速度。

Answer 7

如果您希望通过ID获得所有元素，则可以使用

function getElementsById(elementID){
    var elementCollection = new Array();
    var allElements = document.getElementsByTagName("*");
    for(i = 0; i < allElements.length; i++){
        if(allElements[i].id == elementID){
            elementCollection.push(allElements[i]);
        }
    }
    return elementCollection;
}

如何使用javascript按值选择输入元素？

7 个答案: