javascript - 用样式表中的新样式替换以前的样式值并保存该样式

Question

我正在做一个元素，我们使用 jquery 附加函数附加任何元素的样式并保存该样式。它正在为具有不同值的该样式创建重复行。我想检查此元素、类、Id 是否存在某些样式，而不是将其替换为新样式并删除旧样式。这是我的短代码。

<input type="number" onclick="changeHeight(this)">

<script> 
    function changeHeight(ele){
        var het=$(ele).val();
        $('style').append("#its_height{height:"+het+px"}");
    }
</script>

我的输出:

<style>
#its_height{color:red}
#its_height{width:40px}
    #its_height{height:30px} #its_height{height:40px} #its_height{height:43px}
</style>

我希望它应该像下面这样，以避免重复输入和密集数据。 ** 它应该删除旧的 heigts，例如 30px 和 40px，并且只显示应用到它的最新高度。期望的输出:

<style>
#its_height{color:red}
#its_height{width:40px}
    #its_height{height:43px}
</style>

Answer 1

编辑后的答案:好的，我明白您要做什么。由于您正在将样式复制回数据库并且您已经涵盖了它 - 您只需要更改样式的那部分，使用 .replace('text to replace', 'new text to use')

因此，首先获取计算样式并将其设置在 var 中，然后在“要查找的文本”中使用该 var，并在“要使用的新文本”中使用替换值 var。

    function changeHeight(ele){
        var styleToReplace = $('#its_height').css(height),
        het = $(ele).val();
        $('style').html(text.replace(('#its_height{height:')+($.styleToReplace)+('px;}'), ('#its_height{height:')+($.het)+('px;}')));
    }

我不确定 het var 是什么，但上面应该用您的 het var 替换当前高度值。

我也不确定你为什么没有；在您的样式属性之后。不应该是带有结束分号的 #its_height{height:30px;} 吗？还是这里不需要分号？无论如何，我在上面的示例中包含了分号。