📜  jQuery |添加带有示例的元素

📅  最后修改于: 2021-11-25 04:28:59             🧑  作者: Mango

jQuery 中的add 元素用于在文档中追加内容。下面列出了用于添加内容的方法:

  • append():在被选元素的末尾插入内容。
  • prepend():在被选元素的开头插入内容。
  • after():在被选元素之后插入内容。
  • before():在被选元素之前插入内容。

使用 append() 方法: jQuery 中的 append() 方法用于在所选元素的末尾添加一个新元素。

句法:

$(selector).append("element_to_be_inserted")

参数:此方法接受需要插入的单个参数元素。

返回值:它不返回任何东西。

示例:此示例使用 append() 方法添加新元素。


    
        Append Elements
    
      
    
        
                
  1.             
  2.             
  3.         
                                                                         

输出:

使用 prepend() 方法: jQuery 中的 prepend() 方法用于在所选元素的开头添加一个新元素。

句法:

$(selector).prepend("element_to_be_inserted")

参数:此方法接受要作为参数插入到 DOM 中的单个参数。

返回值:它不返回任何值。

示例:本示例使用 prepend() 方法添加一个新段落。



  

    
        prepend() method
    
      
    

  

   
    
        

The first paragraph

        

The second paragraph

        

The third paragraph

    
                                     Prepend     

输出:

使用 after 方法: jQuery 中的 after() 方法用于在被选元素之后插入内容。

句法:

$(selector).after("element_to_be_inserted")

参数:此方法接受单个参数,该参数用于作为参数插入到 DOM 中。

返回值:它不返回任何东西。

示例:本示例使用 after() 方法在 geeksforgeeks 图像后添加一个单词。



  

    
        Add Elements using after() method
    
  
    

  

    

                            

输出:

使用 before 方法: jQuery 中的 before() 方法用于在被选元素之前插入内容。

句法:

$(selector).before("element_to_be_inserted")

参数:此方法接受单个参数,该参数用于作为参数插入到 DOM 中。

返回值:它不返回任何东西。

示例:本示例使用 before 方法在 geeksforgeeks 图像之前添加元素。



  

    
        Add Element using before() method
    
      
    

  

      

                               

输出: