首页 > 有什么dom能操作到<style>标签中的单条记录吗?

有什么dom能操作到<style>标签中的单条记录吗?

目前我是整体刷新的:

<script>
    if('textContent' in ele){
        ele.textContent=css;
    }
    else{
        ele.styleSheet.cssText=css;//ie6-8
    }
</script>

但是在一个标签中有成百上千条记录时,并不需要刷新全部,有没有办法只替换某条记录甚至某条记录中的某项,使得css重绘效率大幅度提升?比如:

<style>
    @media all{
        body{
            color:red;
        }
    }
</style>

有什么dom分别是对应media那层、body那条、color那项的(读/写;兼容至ie6)?


由于有的同学一看就觉得这不科学不可能存在,只好遍历找出了一点相关的dom(chrome下)供赏析:

<style>
    html{
        font-size:12px;color:red;
    }

@media all{
    head{
        color:red;
    }
}
</style>
<script>
style={
    sheet:{
        parentStyleSheet:null,
        ownerRule:null,
        ownerNode:style,
        cssRules:style.sheet.rules={
            length:2,
            0:{
                parentRule:null,
                parentStyleSheet:style.sheet,
                type:1,
                cssText:"html { color: red; }",
                selectorText:"html",
                style:{
                    parentRule:style.sheet.cssRules[0],
                    cssText:"font-size: 12px; color: red;",
                    length:2,
                    0:"font-size",
                    1:"color",
                    fontSize:"12px",
                    color:"red"
                }
            },
        },
        deleteRule:function(){},
        insertRule:function(){},
        removeRule:function(){},
        addRule:function(){}
    }
};
</script>

只是觉得这样找很不可靠与系统,倒不是费时费力的问题。没有测试ie6。没有尝试其中的修改函数,以及属性直接修改是否有效。


抱歉。。。这个真不能。。。如果可以的话,连js都不用写动画框架了,直接用js写keyframe,然后绑定就可以了。。。。不过你可以用Dom操作把style的标签放进去

【热门文章】
【热门文章】