jquery 在克隆后更改子 div 的 CSS

标签 jquery css html clone

在我克隆一个 DIV 并可以更改它的 CSS 属性之后,但找不到如何更改它的子 DIV 的 CSS。 在下面的示例中,我想将#details-child 的背景从黄色更改为蓝色。 CSS:

#wrapper {
    width:200px;
    background:gray;
}
#details {
    width:200px;
    height:100px;
    background:green;
}
#details-child {
    width:100px;
    height:100px;
    background:yellow;
}

JS:

jQuery.noConflict();
jQuery(document).ready(function() {
    // clone
        clone_details = jQuery("#details").clone();

    // change CSS           
        clone_details.css({'margin-top':'50px', 'background':'red'});
        // jQuery("#details-child").css('background','blue'); // changes original div

    // render clone
        jQuery("#wrapper").append(clone_details);
});

最佳答案

一旦有了 jquery 对象,就可以使用 $.find() 在该对象的范围内进行选择器搜索

http://api.jquery.com/find/

clone_details.find('#details-child').something();

但是,您不希望最终到处都是重复的 ID,因此我建议您改用类而不是 ID,因为它们必须是唯一的。

关于jquery 在克隆后更改子 div 的 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2183367/

相关文章:

javascript - 更改表格中的单元格颜色

javascript - 为什么 Onblur 不起作用(JQuery/Javascript)

php - 将内联 HTML 存储在 PHP 变量中

html - Swiffy 转换错误(Flash 到 HTML5)

javascript - jquery 中的绑定(bind)属性 - 识别事件

javascript - HighCharts:树形图数据标签在向下钻取/向上钻取时不一致

css - 字体粗细在无序列表中被继承

html - 如何使用 CSS 平滑地上下移动图像?

javascript - 导入 Bootstrap 后文本框似乎闪烁

php - jQuery 脚本之间的冲突