insertBefore()

посл. ред. 12.08.2016

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

Варианты использования

jQ_object.insertBefore(селектор) => jQuery: Добавляет/перемещает элементы текущей выборки перед каждым элементом, удовлетворяющим указанному селектору.
jQ_object.insertBefore(DOM-элемент) => jQuery: Добавляет/перемещает элементы текущей выборки перед указанным DOM-элементом.
jQ_object.insertBefore(jQuery-объект) => jQuery: Добавляет/перемещает элементы текущей выборки перед каждым элементом, представленным jQuery-объектом.

Примеры

<html>
<head>
  <title>Работа с элементами DOM</title>
  <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
  <p>Параграф 1</p>
  <p>Параграф 2</p>
</body>
</html>
 
<script>
$('<p>Дата: </p>')
  .insertBefore('p');
/* добавление HTML-кода перед каждым параграфом */
</script>

Дата:

Параграф 1

Дата:

Параграф 2

<html>
<head>
  <title>Работа с элементами DOM</title>
  <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
  <p>Параграф 1</p>
  <p class="par2">Параграф 2</p>
  <p class="par3">Параграф 3</p>
</body>
</html>
 
<script>
$('.par3')
  .insertBefore('.par2');
/* перемещение 3-го параграфа перед 2-ым */
</script>

Параграф 1

Параграф 3

Параграф 2