Question

我有以下标记，无法修改：

<li class="campID">
    <label for="input_2_14">Name</label>
    <div>
        <input name="input_14" id="input_2_14" type="text" value="" class="medium" tabindex="11">
     </div>
</li>

我想选择输入并使用vanilla JS更改其值（假设jQuery不可用）。

我不能使用输入名称或ID，因为它们是动态的，会发生变化。

我尝试了以下但是它似乎不起作用：

(function(){
  var listElement = document.getElementsByClassName('campID');
  var myInput = listElement.getElementsByTagName('input');
  myInput[0].value = 'John';
})();

Answer 1

如果您的目标是IE8及以上，那么：

document.querySelector("li.campID input").value="John";

否则：

假设仅有第一个LI和输入：

var liListItem = document.getElementsByClassName("campID")[0],
    inputElement = liListItem.getElementsByTagName("input")[0];
    inputElement.value = "John";

document.getElementsByClassName("campID")返回NodeList。所以你需要循环并做。

Answer 2

querySelector() 和 querySelectorAll() 完整的CSS选择器。

querySelector（）仅在节点中返回第一个匹配元素节点。

而

querySelectorAll（）会在节点中返回节点列表，其中包含所有匹配的元素节点。

您必须使用 querySelectorAll（）选择器来选择多种用途，

var in =  document.querySelectorAll(".campID input");
in.value = 'John';
console.log(in);

控制台返回：

[input#input_2_14.medium, value: "John", item: function]

Answer 3

我知道已经很久了。想到发布适合我的解决方案。对于以下HTML

  sapply(data,function(j) ifelse(j<.2,NA,j))

给VAUXHALL。

用于在Javascript中查找嵌套标记名和赋值的类名

3 个答案: