javascript - 通过 jQuery 为将来创建的元素添加 CSS 规则

Question

我有一个有点不寻常的问题。我做过很多次这样的事情:

$('#selector').css('color','#00f');

我的问题是我创建了一个 <div id="selector"> ，我调用上面的命令，它工作正常。

现在，在另一个事件中，稍后，我从 DOM 中删除该元素并在稍后使用相同的 ID 再次添加它。此元素现在没有 color:#00f .

有没有一种方法可以在 CSS 中添加规则，这样它会影响将来使用相同的 id 创建的元素？/class ？我喜欢jQuery , 但任何使用纯 JavaScript 的东西都可以。

它必须是动态的，我不知道要放入 CSS 文件中的类。此外，我计划在整个应用程序过程中多次更改单个属性。例如，设置 color至 black , 至 blue , 至 red ，然后返回 black .

---

我接受了 @lucassp 的回答，这就是我最终得到的:

function toggleIcon(elem, classname)
{
    if($(elem).attr('src')=='img/checkbox_checked.gif')
    {
        $(elem).attr('src', 'img/checkbox_unchecked.gif')
        //$('.'+classname).hide();//this was the old line that I removed
        $('html > head').append($('<style>.'+classname+' { display:none; }</style>'));
    }
    else
    {
        $(elem).attr('src', 'img/checkbox_checked.gif')
        //$('.'+classname).show();//this was the old line that I removed
        $('html > head').append($('<style>.'+classname+' { display:block; }</style>'));
    }
}

我还想说 @Nelson 可能是最“正确”的，尽管它需要更多的工作才能进入始终运行良好的应用程序代码，而这不是我想花费的精力此刻。

如果我将来不得不重写这个(或写类似的东西)，我会研究 detach() .

Answer 1

这应该有效:

var style = $('<style>.class { background-color: blue; }</style>');
$('html > head').append(style);