使用纯 JS 删除 CSS 属性失败

remove css property with pure js failed

本文关键字：CSS 属性 失败 删除 JS      更新时间：2023-09-26

我尝试使用以下代码从我的 css 中删除属性，但不起作用。 

 document.getElementById("wrap").style.removeProperty('overflow-x');

CSS：

#wrap{
overflow-x : hidden;
}

当我运行javascript时，我收到错误Cannot read property 'style' of null

发布的代码将删除以下场景中的溢出 x 样式：

<div id="wrap" style="overflow-x: hidden"></div>

CSS 应用的属性不会直接应用于元素的样式属性 - 它们应用于更高的层。

实际上，style 属性上没有要删除的内容，但您可以在那里设置一个值，这将覆盖从 CSS 属性应用的值（除非 css 指定了!important标志）

试试这个：

document.getElementById("wrap").style.overflowX = 'visible';

由于您的特定方案是关于基于某些浏览器检测应用样式，因此我建议使用以下 javascript：

var userAgent = window.navigator.userAgent.toLowerCase();
var is_ios = /iphone|ipod|ipad/.test( userAgent );
if (!is_ios) document.body.className += 'not-ios';

使用 CSS：

.not-ios #wrap {
    overflow-x : hidden;
}

您也可以使用class"换行"而不是id来使其更可重用（如果需要）

相关文章：