Question

我有一个带有一些产品图像的图像滑块：每个产品con都有不同的图片，可以通过无序列表元素的类（DeepFaceMashie，McDowall，Niblick，在示例中）识别。

<div class="cd-slider-wrapper">
    <ul class="cd-slider">                          
        <li class="selected DeepFaceMashie"><img src="img/deepface.jpeg"></li>
        <li class="DeepFaceMashie"><img src="img/deepface2.jpeg"></li>
        <li class="DeepFaceMashie"><img src="img/deepface3.jpeg"></li>
        <li class="McDowall"><img src="img/mcdowall.jpeg"></li>
        <li class="McDowall"><img src="img/mcdowall2.jpeg"></li>
        <li class="McDowall"><img src="img/mcdowall3.jpeg"></li>
        <li class="Niblick"><img src="img/niblick.jpeg"></li>
        <li class="Niblick"><img src="img/niblick2.jpeg"></li>
    </ul>                       
</div>

通过javascript，我可以获得无序列表的所有元素

sliderContainer = navigation.parents('.cd-slider-wrapper').find('.cd-slider')

此时，如何创建只包含一个产品图片的sliderContainer副本？我只能提取子元素，但我需要保留slideerContainer结构，只有选中的元素。

Answer 1

如果我的理解是正确的，那么您需要使用通过类名选择的特定类型的产品来复制该滑块！？如果是这样，您可以克隆此滑块并在其旁边插入副本或选择的特定元素。接下来你要做的就是删除不必要的元素：

$( ".cd-slider" ).clone().appendTo(".cd-slider-wrapper").contents().not('.McDowall').remove();

working example for slider clone with specific content

如何根据类名

1 个答案: