如何使用 jQuery 在单击按钮时隐藏 HTML 代码块？

在本文中，我们将学习如何通过单击按钮隐藏 HTML 代码块。我们可以通过使用 jQuery 内置的hide()方法来做到这一点。让我们简要了解一下这个方法的功能。

hide()：在 CSS 中，我们有一个属性display:none基本上隐藏了元素。 jQuery 中的这个hide() 方法也隐藏了被选元素。

句法：

$(selector).hide()

示例 1：在下面的示例中，文本将在 2 秒后隐藏。所选元素将立即隐藏。这与调用.css(“display”, “none”) 相同。在隐藏之前， hide()方法将“display ”属性的值保存在 jQuery 的数据缓存中，以便“ display ”稍后可以恢复到其初始值。

HTML

  

    
    
    

  

    Below text will remove in 2 sec
  
    
        Hello Geeks
    
  
    
        setTimeout(function(){
            $("#test").hide()
        },2000)
    

  

输出：

隐藏方法

示例 2：在下面的示例中，我们将学习如何使用 jQuery 在单击按钮时隐藏 HTML 代码块。

HTML

  

    
    
    

  

    Click on the button to hide below text.
  
    
        Hello Geeks
    
  
    Click Me
    
        $('button').click(function(){
            $("#test").hide()
        })
    

输出：

点击时隐藏