可以通过以下两种方式来实现:
// HTML
<div id="parentDiv">
<div id="childDiv" style="background-color: red;">Click me</div>
</div>
// JavaScript
document.getElementById("parentDiv").addEventListener("click", function(event) {
if (event.target.id === "childDiv") {
event.preventDefault();
}
});
这种方式可以通过event.target来获取点击的目标元素,可以进一步针对特定的元素进行处理,比如避免内联样式的更改。
<style>
.disable-click {
pointer-events: none;
}
</style>
<div id="div" class="disable-click" style="background-color: red;">Click me</div>
这种方式通过将div添加一个类名,然后在CSS中设置pointer-events为none,可以禁用div的点击事件,从而避免内联样式的更改。
总结起来,以上两种方式都可以实现在div上单击时,不改变内联样式。具体选择哪种方式取决于具体的需求和场景。如果需要更多的灵活性和处理逻辑,则可以使用事件委托的方式;如果仅仅是禁用点击事件,可以使用CSS样式的方式。
领取专属 10元无门槛券
手把手带您无忧上云