Javascript：同时获取其类名和类型的输入

Question

无论如何，我可以通过其类名获得输入吗？例如，我在下面有这个html代码：

<span class="inputClass">
   <input type="checkbox"/>
<span>

我想看看是否使用其类名选择了该输入。我无法为其指定ID，因为我们无权访问此源代码。

Answer 1

使用document.querySelector('.inputClass > input[type="checkbox"]')。

const inputEle = document.querySelector('.inputClass > input');
console.log('isChecked: ', inputEle.checked);

inputEle.addEventListener('change', function() {
    console.log(this.checked);
});

<span class="inputClass">
    <input type="checkbox"/>
<span>

Answer 2

您可以从父类的子类中选择输入

.inputClass > input[type=checkbox]

下面是有效的代码段。

console.log(document.querySelector('.inputClass > input[type=checkbox]').checked)

<span class="inputClass">
   <input type="checkbox"/>
<span>