Метод .before() вставляет заданное содержимое, либо перемещает указанные элементы, вставляя их перед каждым элементом набора jQuery.

Главная » jQuery API » .before()

Категории: Manipulation › DOM Insertion, Outside

.before()

Вставляет заданное содержимое, либо перемещает указанные элементы, вставляя их перед каждым элементом набора jQuery.

Синтаксис и описание:

Добавлено в jQuery 1.0.before( source [, source ])
Добавлено в jQuery 1.4.before( function(index) )
Метод .before() добавляет фрагмент HTML разметки или созданные на лету DOM-элементы, либо перемещает все существующие элементы, определяемые входным параметром, последовательно вставляя их перед каждым элементом в наборе jQuery.

Возвращаемое значение: (объект) Набор jQuery.

Параметры:

source – (строка | элемент | объект jQuery ) Одна или несколько строк с кодом разметки HTML, либо ссылок на существующие или созданные на лету DOM-элементы (либо массив элементов), или наборы jQuery.
function( index ) – (функция) Возвращает HTML-строку для вставки перед соответствующими элементами. В качестве аргумента получает index - индекс текущего элемента в наборе jQuery.

Примечание:

До версии jQuery 1.3, если в качестве места назначения определены не один, а несколько элементов, то все существующие исходные элементы не перемещаются, а копируются и вставляются сразу перед каждым принимающим элементом, сами оставаясь при этом в своем прежнем местоположении.
Примечание:

Начиная с версии jQuery 1.4 метод .before() может работать с только что созданными на лету элементами, которые еще не являются DOM узлами. Например, создать элемент <div>, создать и вставить перед ним элемент <p>, потом добавить им атрибуты, текстовое содержимое, и только после этого вставить все вместе в дерево DOM:

$('<div/>').before('<p></p>').addClass('foo') .filter('p').attr('id','bar').html('hello') .end().appendTo('body');

Результатом выполнения данной цепочки команд jQuery будет вставка в конец содержимого тела документа (перед закрывающим тегом </body>) готовых DOM-элементов:

<p class="foo" id="bar">hello</p> <div class="foo"></div>

Следует обратить внимание на то, что в результате вставки абзаца <p> перед созданным на лету блоком <div>, метод .before() возвращает объединенный набор jQuery (абзац также становится элементом набора), чего не происходило бы при обычной вставке перед существующим элементом <div> (возвращаемый набор jQuery остался бы без изменений).

Примеры:

// Переместить заголовок <h1>, вставив его перед 
// элементом с id='general'.

$('#general').before($('h1'));

// Вставить перед каждым абзацем <p> созданный на лету 
// с помощью функции блок <div>, содержимое которого 
// является именем класса, имеющегося у текущего абзаца.

$('p').before(function() {
  return '<div>' + this.className + '</div>';
 });

[ наверх ]

www.jQueryBook.ru - jQuery документация

.before()

Вставляет заданное содержимое, либо перемещает указанные элементы, вставляя их перед каждым элементом набора jQuery.

Добавлено в jQuery 1.0.before( source [, source ])

Добавлено в jQuery 1.4.before( function(index) )