Question

我有一个DOMNodeInserted侦听器，该侦听器在添加具有特定类的项目时触发。在那之后，我想在该特定添加项之前添加一些html。这是我如何实现的代码

var conditionValue = `<div class="custom-condition">${$.trim($('.group-conditions label').text())} </div>`;

$('.rules-list').on('DOMNodeInserted', function(e) {
    if ( $(e.target).hasClass('rule-container') ) {
        //element with .MyClass was inserted.
        var ruleFilterContainer = $('.rule-filter-container');

        //First attempt to prepend the html to the specific added item
        $(e.target).find('.rule-filter-container')[0].prepend(conditionValue);

        //Second attempt to prepend the html to the specific added item
        ruleFilterContainer.each(function(index, item){
            console.log(item, $(item).find('.custom-condition').length)
            if($(item).find('.custom-condition').length < 1){
                console.log($(item))
                $(item)[0].prepend(conditionValue);
            }
        })
    }
});

在两次尝试中，当我将选择器记录为prepend方法时，它都会向我显示正确的html选择器，但没有在html之前。

这怎么可能？

Answer 1

使用.eq(0)而不是[0]，以将元素保留为jQuery对象。然后，您可以根据需要使用prepend方法。

如果您知道只有一个元素，则不必执行任何一个操作，而只需添加到jQuery对象即可。

前置项不起作用

1 个答案: