在 jQuery replaceWith() 方法后执行 owl-carousel 脚本（DOM 元素替换）

Question

Here is my jsFiddle

准备好文件后我想：

1. 将3个div(with classes:'one', 'two', 'three'')替换为3个div(每个div相同 class 'smilling') 与 jQuery replaceWith() 方法，

2. 运行 owl-carousel 插件。

我不知道为什么，但是尽管 dom 元素替换 确实 成功了 owl-carousel 没有加载..有什么建议吗？我为什么要这样做？跟MediaQueries有点关系...

我的jQuery:

$(document).ready(function() {

    $("div.super").replaceWith('<div class="smilling item"></div><div class="smilling item"></div><div class="smilling item"></div>');

$('.owl-carousel').owlCarousel({
                    loop:false,
                    nav:true,
                    items:1 
                });

});

Answer 1

问题是，您正在使用 replaceWith() 替换 .super class。您要做的是替换 .super class.

的所有 child

改为在 .item 上调用 replaceWith()，而不是三个新的 div 只产生一个新的 div。

像这样的东西会起作用：

$(document).ready(function() {

$("div.item").replaceWith('<div class="smilling item"></div>');

$('.owl-carousel').owlCarousel({
                loop:false,
                nav:true,
                items:1 
            });

});