Ответ 1
Ключом является эта строка в документации.wrap():
Этот метод возвращает исходный набор элементов для цепочки.
.wrap() работает только с элементом, уже находящимся в DOM. Таким образом, вам нужно будет вставить его, а затем обернуть его.
(function($) {
$.extend({
notify: function(options, duration) {
var defaults = {
inline: true,
href: '',
html: ''
};
var options = $.extend(defaults, options);
var body = $('body'),
container = $('<ul></ul>').attr('id', 'notification_area'),
wrapper = '<li class="notification"></li>',
clone;
if (!body.hasClass('notifications_active')) {
body.append(container).addClass('notifications_active');
}
if (options.inline == true && options.href) {
clone = $(options.href).clone().wrap(wrapper);
}
clone.css('visibility', 'hidden').appendTo(container);
var clone_height = 0 - parseInt(clone.outerHeight());
clone.css('marginBottom', clone_height);
clone.animate({
marginBottom: 0
}, 'fast', function() {
clone.hide().css('visibility', 'visible').fadeIn('fast');
});
}
});
})(jQuery);
$(function() {
$('a').click(function() {
$.notify({
inline: true,
href: '#alert'
}, 3000)
})
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Ключом является эта строка в документации.wrap():
Этот метод возвращает исходный набор элементов для цепочки.
.wrap() работает только с элементом, уже находящимся в DOM. Таким образом, вам нужно будет вставить его, а затем обернуть его.
Возможно, для вас была запутанная часть, которая .wrap()
возвращает внутренний элемент, а не родительский элемент.
Таким образом, вы должны использовать родительский объект завернутого типа следующим образом:
var $divA= $("<div/>").addClass('classA'),
$divB= $("<div/>").addClass('classB');
console.log( $divA.wrap($divB).parent() );
($divA.parent()
равно $divB
после обертывания)
Итак, ключевая часть заключается в том, что $divA.wrap($divB)
возвращает $divA
, а не $divB
см. ссылку:
Этот метод возвращает исходный набор элементов для цепочки.
Обратите внимание: элементы НЕ должны находиться в DOM, jQuery может работать на них, не будучи вставленными в DOM.