HTML模板字符串：“输入标签类型”复选框

Question

我需要为myObject的每个元素创建一个复选框输入，我决定为此使用Template文字：

function checkTemplate(myObject){
    var checkboxDiv = checkboxesArtist;
    checkboxDiv.innerHTML=`
        ${myObject.map(function(art){
            return `
            <div class='form-check'>
                <label class='form-check-label' for='${art.id}'>
                    <input class='form-check-input artist_opinion' id='${art.id}' 
                    type='checkbox' name='${art.name}' value='${art.id}'/>
                    ${art.name}
                    <small class='text-secundary'>${art.count}</small>
                </label>
            </div>   
        `
        }).join('')} 
    `
} 

如何访问每个复选框的状态？我尝试通过

创建一个数组

input = document.getElementsByClassName('form-check-input artist_opinion');

如果我执行console.log（input），则可以看到包含所有元素的HTML集合数组，但是请注意“下面的值刚刚才被评估”，如果我执行console.log（input.length），那是0。所以我不知道如何访问使用上述代码段创建的元素，尤其是如何检查复选框的值。

Answer 1

您可以使用document.getElementById，因为您已经基于艺术家的ID为每个输入分配了ID。然后，您可以遍历artist中的每个myObject，以创建ID列表以检查其值。或者，如果您要检查特定的复选框，则可以使用艺术家的ID来获取该复选框的值。