什么是jQuery中的链式

什么是jQuery中的链式

在jQuery中,链允许我们在一个单一的语句中对一个元素进行多个操作。

大部分的jQuery函数都会返回一个jQuery对象,由于这个原因,当第一个方法完成执行时,它返回一个obj,现在第二个方法将在这个对象上调用。

例子1:在链式的帮助下,我们可以简洁地开发我们的代码。链式也使我们的脚本更快,因为现在浏览器不必再去寻找相同的元素来对它们进行操作。‘gfg’对象的每个方法都在返回一个对象。

首先,调用geek()方法,然后调用write()方法,然后调用destroy()方法。

<!DOCTYPE html>
<head>
  <script src=
      "https://code.jquery.com/jquery-git.js">
  </script>
</head>
  
<body>
    <script>
        let gfg = {
            geek: function(){
                alert('called geek method');
                return gfg;
            },
            write: function(){
                alert('called write method');
                return gfg;
            },
            destroy: function(){
                alert('called destroy method');
                return gfg;
            }
        }
  
        gfg.geek().write().destroy();
    </script>
</body>
  
</html>

输出:

什么是jQuery中的链式?

例子2:下面的代码演示了fadeOut()fadeIn() 方法的连锁反应。每当你点击按钮时,文本将首先淡出,然后淡入。

<!DOCTYPE html>
<head>
    <!-- jQuery library -->
    <script src="https://code.jquery.com/jquery-git.js"></script>
</head>
  
<body>
    <p id="first">GeeksForGeeks</p>
  
    <button>click me</button>
    <script>
        (document).ready(function(){
            ('button').click(function(){
                $('#first').fadeOut(100).fadeIn(100);
            })
        })
    </script>
</body>
  
</html>

输出:

什么是jQuery中的链式?

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程