如何使用javascript删除css属性?

时间:2010-01-08 13:50:14

标签: javascript css

是否可以使用JavaScript删除元素的CSS属性? 例如我有div.style.zoom = 1.2, 现在我想通过JavaScript删除缩放属性?

11 个答案:

答案 0 :(得分:156)

通常,您无法从内置对象中删除属性,当然也不能在IE中删除(样式对象的缩放属性是IE扩展)

您可以将其设置为默认值:

el.style.zoom = "";

现在,有效缩放将是样式表中设置的定义(通过链接和样式标记)之后的任何内容。

因此,此语法仅修改此元素的本地样式。

答案 1 :(得分:90)

removeProperty 会从元素中删除样式。

示例:

  

div.style.removeProperty( '缩放');

MDN文档页面:
CSSStyleDeclaration.removeProperty

答案 2 :(得分:18)

div.style.removeProperty('zoom');

答案 3 :(得分:9)

您可以使用styleSheets对象:

document.styleSheets[0].cssRules[0].style.removeProperty("zoom");

警告#1:您必须知道样式表的索引和规则的索引。

警告#2:浏览器不一致地实现此对象;什么在一个工作可能不适用于其他人。

答案 4 :(得分:5)

element.style.height = null;

output:

<div style="height:100px;"> 
// results: 
<div style="">

答案 5 :(得分:4)

您可以尝试查找具有此类的所有元素,并将“zoom”属性设置为“nothing”。

如果您使用的是jQuery javascript库,则可以使用$(".the_required_class").css("zoom","")

执行此操作

编辑:已删除此声明,因为事实证明并非如此,正如评论及其他答案所指出的那样,自2010年以来确实有可能。

错误:通常没有从JavaScript修改样式表的方法。

答案 6 :(得分:1)

您也可以通过说$(selector).css("zoom", "")

在jQuery中执行此操作

答案 7 :(得分:0)

这应该可以解决 - 将内联样式设置为正常缩放:

  

$('div')。attr(“style”,“zoom:normal;”);

答案 8 :(得分:0)

实际上,如果你已经知道了这个属性,那就可以了......

例如:

<a href="test.html" style="color:white;zoom:1.2" id="MyLink"></a>

    var txt = "";
    txt = getStyle(InterTabLink);
    setStyle(InterTabLink, txt.replace("zoom\:1\.2\;","");

    function setStyle(element, styleText){
        if(element.style.setAttribute)
            element.style.setAttribute("cssText", styleText );
        else
            element.setAttribute("style", styleText );
    }

    /* getStyle function */
    function getStyle(element){
        var styleText = element.getAttribute('style');
        if(styleText == null)
            return "";
        if (typeof styleText == 'string') // !IE
            return styleText;
        else  // IE
            return styleText.cssText;
    } 

请注意,这仅适用于内联样式...不是您通过类或类似内容指定的样式...

其他注意:您可能必须在该替换语句中转义某些字符,但您明白了。

答案 9 :(得分:-1)

这对我有用。...它将覆盖未删除的CSS样式。

尝试一下。

$(document).ready(function(){
    var bugfix = document.createElement('style')
    bugfix.innerHTML = "body {overflow-x: hidden !important;}";
    document.body.appendChild(bugfix);
  });

答案 10 :(得分:-3)

更改元素的所有类:

document.getElementById("ElementID").className = "CssClass";

要为元素添加其他类:

document.getElementById("ElementID").className += " CssClass";

检查某个类是否已应用于元素:

if ( document.getElementById("ElementID").className.match(/(?:^|\s)CssClass(?!\S)/) )