0

考虑以下示例：

<html>
<head>
</head>
<body>
<style type="text/css">
.hide
{
    display: none;
}
</style>
<button style="width:200;height:20;background-color:#B4CFEC;font: bold 10px Verdana" onclick="document.getElementById('CUST_CLASS').classList.remove('hide');" >CUSTOMER DIMENSION</button>
<div class="hide" id="CUST_CLASS">"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</div>
</body>
</html>

我正在使用 document.getElementById('id').classList.remove('class'); 在这里发挥作用。我应该使用不同的功能吗？只有微软的东西？

4

1 回答 1

-1

这是可怕的，但删除了指定的类，保留所有其他类：

onclick="document.getElementById('CUST_CLASS').setAttribute('class', document.getElementById('CUST_CLASS').getAttribute('class').replace('hide', ''));"

正如所评论的，IE9 不支持classList，因此您可以对其进行填充，或者回退到 jQuery，这将处理浏览器兼容性。这是与您的代码等效的 jQuery：

$("#CUST_CLASS").removeClass("hide");

但是，如果您的hide类仅用于切换可见性，则可以进一步简化：

$("#CUST_CLASS").hide();
$("#CUST_CLASS").show();
于 2013-07-22T01:19:57.133 回答