javascript - 向注入(inject)的 DOM 元素添加 CSS 样式

Question

我正在使用 javascript 将一些 DOM 元素注入(inject)到页面中。我能够注入(inject)单个 DOM 元素并对其应用 CSS 样式:

var $e = $('<div id="header"></div>');
$('body').append($e);

$e.css({
    background: '#fbf7f7',
});

问题:如果我在 $e 中有嵌套元素，我如何将 CSS 样式分别应用到父元素和它的子元素？

var $e = $('<div id="header"><div class="header-content"><span class="title"></span></div></div>');

Answer 1

当您将类应用到父元素内的 div 时，您可以简单地为该 class header-content 创建一个样式并应用它。

为了动态应用样式，您可以像这样简单地为单个元素添加类

$('#id-of-element').addClass("header-content");

您还可以在父元素中找到元素，如下所示

$e.find('.header-content').css('background-color', '#ccc');