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

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

<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>

---

如果您的目标是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”）

返回节点列表。因此，您可能需要循环执行。

querySelector（）

和

querySelector（）

完成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]

---

我知道已经很久了。只是想发布对我有效的解决方案。对于下面的HTML

`
    <li class="list-summary-item">
        <span>Registration number</span>
        <span class="reg-mark">LT08 YJA</span>
    </li>
    <li class="list-summary-item">
        <span>Colour</span>
        <span><strong>BLACK</strong></span>
    </li>
    <li class="list-summary-item">
        <span>Make</span>
        <span><strong>VAUXHALL</strong></span>
    </li>
`

 <br>
document.getElementsByClassName('list-summary-item')[2].getElementsByTagName('span')[1].getElementsByTagName('strong')[0].innerHTML <br>

`

注册号
LT08 YJA


颜色
黑色


制作
VAUXHALL

`


document.getElementsByTagName（'list-summary-item'）[2]。getElementsByTagName（'span'）[1]。getElementsByTagName（'strong'）[0]。innerHTML

---

给出了VAUXHALL。

您忘记在两者之间添加

…应该类似于

listElement[0]。getElementsByTagName（'input'）
`
    <li class="list-summary-item">
        <span>Registration number</span>
        <span class="reg-mark">LT08 YJA</span>
    </li>
    <li class="list-summary-item">
        <span>Colour</span>
        <span><strong>BLACK</strong></span>
    </li>
    <li class="list-summary-item">
        <span>Make</span>
        <span><strong>VAUXHALL</strong></span>
    </li>
`

 <br>
document.getElementsByClassName('list-summary-item')[2].getElementsByTagName('span')[1].getElementsByTagName('strong')[0].innerHTML <br>