我有这样的HTML标记。
<html>
<head></head>
<body>
<input type="checkbox" id="Randomly generated ID" onclick="fun()">
<label for="CHECKBOX_ID" id="Randomly generated ID">SOME TEXT</label>
</body>
</html>
在单击复选框时,我想使用javascript中的fun()函数为标签添加CSS样式。我这样做很麻烦,而且两个元素都有一个随机生成的ID,不能有相同的ID。
这是使用Vanilla Js的实现。
function fun(inputElement) {
var backgroundColor = inputElement.checked ? 'yellow' : 'white';
var labelSelector = 'label[for="' + inputElement.id + '"]';
var labelElement = document.querySelector(labelSelector);
inputElement.style.background = backgroundColor;
labelElement.style.background = backgroundColor;
}
<html>
<head></head>
<body>
<input type="checkbox" id="CHECKBOX_ID" onclick="fun(this)">
<label for="CHECKBOX_ID" id="Randomly generated ID">SOME TEXT</label>
</body>
</html>
希望这会对您有所帮助,谢谢。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句