如何获取Handlebars动态生成ID的元素并实现初始隐藏？

不用纠结动态ID，直接用类选择器或者父元素选择器就能搞定，给你几个靠谱的方案：

方案1：用CSS直接默认隐藏（最省事） #

直接在样式里写，页面加载时就生效，不用额外写JS：

/* 选中所有动态生成的label元素 */
.btn-group-toggle .btn.btn-secondary {
    display: none;
}

等用户点击按钮时，再用JS把这些元素显示出来即可。

方案2：用jQuery选择器批量选中 #

放弃依赖ID选择，直接通过元素的类或层级关系选中所有目标元素，把你的JS改成这样：

$(document).ready(function () {
    // 选中所有.btn-group-toggle下的.btn.btn-secondary元素
    $('.btn-group-toggle .btn.btn-secondary').hide();
});

这样不管ID是怎么动态生成的，只要元素结构和类名不变，就能全部选中并隐藏。

补充说明 #

如果你的Handlebars是异步渲染的（比如AJAX请求后才渲染元素），$(document).ready可能会因为元素还未生成而失效，这时候可以把隐藏代码放在Handlebars渲染完成的回调里，或者优先用方案1的CSS方式更稳妥。

内容的提问来源于stack exchange，提问作者SadCoder