jQuery | before () Метод

Опубликовано: 23 Декабря, 2021

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

Синтаксис:

 $ (селектор) .before (содержание, функция (индекс))

Параметры: этот метод принимает два параметра, как указано выше и описано ниже:

content: этот параметр содержит содержимое, которое нужно вставить перед элементом. Возможным значением содержимого могут быть элементы HTML, элементы DOM, элементы jQuery.
function (index): это необязательный параметр, используемый для указания функции, которая возвращает содержимое для вставки перед элементом, а index возвращает индексное позиционирование элемента.

Пример 1. В этом примере вставляется содержимое перед элементом.

 <!DOCTYPE html>
 < html >
 
< head >
    < title >
        jQuery before() Method
    </ title >
     
    < script src =
 " https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js " >
    </ script >
     
    <!-- Script to insert element before button element -->
    < script >
        $(document).ready(function() {
            $("button").click(function() {
                $("button").before("< p >GeeksforGeeks:"
                + " A computer science portal</ p >");
            });
        });
    </ script >
 </ head >
 
< body >
    < button >Click Here to Insert element before button</ button >
 </ body >
 
</ html > 

Перед нажатием на кнопку:

После нажатия на кнопку:

Пример 2: В этом примере вставляется содержимое перед указанным элементом.

 <!DOCTYPE html>
 < html >
 
< head >
    < title >
        jQuery before() Method
    </ title >
     
    < script src =
 " https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js " >
    </ script >
     
    <!-- Script to add content before the element -->
    < script >
        $(document).ready(function(){
            $("button").click(function(){
                $("span").before("< span >GeeksforGeeks: </ span >");
            });
        });
    </ script >
 </ head >
 
< body >
    < span >A computer science portal for geek</ span >< br >
     
    < span >A computer science portal for geek</ span >< br >
     
    < span >A computer science portal for geek</ span >< br >
     
    < button >Click to insert</ button >
 </ body >
 
</ html > 

Перед нажатием на кнопку:

После нажатия на кнопку:

JQuery Picked

jQuery | before () Метод

РЕКОМЕНДУЕМЫЕ СТАТЬИ