13518219792
网站建设资讯

NEWS

网站建设资讯

使用JQuery怎么实现链式调用

这篇文章给大家介绍使用JQuery怎么实现链式调用，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。

公司主营业务：网站建设、网站制作、移动网站开发等业务。帮助企业客户真正实现互联网宣传，提高企业的竞争能力。创新互联是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化，感谢他们对我们的高要求，感谢他们从不同领域给我们带来的挑战，让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联推出电白免费做网站回馈大家。

jquery是什么

jquery是一个简洁而快速的JavaScript库，它具有独特的链式语法和短小清晰的多功能接口、高效灵活的css选择器，并且可对CSS选择器进行扩展、拥有便捷的插件扩展机制和丰富的插件，是继Prototype之后又一个优秀的JavaScript代码库，能够用于简化事件处理、HTML文档遍历、Ajax交互和动画，以便快速开发网站。

JQuery的特殊效果

fadeOut()淡入
fadeToggle()切换淡入淡出
hide() 隐藏元素
show() 现实元素
toggle() 切换元素的可见状态
slideDown() 向下展开
slideUp() 向上卷起
slideToggle()依次展开或者卷起某个元素




 
 Title
 
  .box{
   width: 300px;
   height: 300px;
   background-color: gold;
   display: none;
  }
 
 
 



 

点击按钮，元素淡出，完成之后弹出done，不知道为什么，没有运行出来，可能是浏览器的问题。

链式调用-层级菜单




 
 Title
 
  body{
   font-family: 'Microsoft Yahei';
  }
  body ul{
   margin: 0;
   padding: 0;
  }
  ul{
   list-style: none;
  }
  .menu{
   width: 300px;
   height: 300px;
  }
  .menu .level1,.menu li ul a {
   display: block;
   width: 300px;
   height: 30px;
   line-height: 30;
   text-decoration: none;
   background-color: #3366cc;
   color: #fff;
   font-size: 16px;
   text-indent: 10px;
  }
  .menu .level1{
   border-bottom: 1px solid #afc6f6;
  }
  .menu li ul a {
   font-size: 14px;
   text-indent: 20px;
   background-color: #7aa1ef;
  }
  .menu li ul li{
   border-bottom: 1px solid #afc6f6;
  }
  .menu li ul {
   display: none;
  }
  .menu li ul li a:hover{
   background-color: #f6b544;
  }
 
 
 
  $(function () {
   $('.level1').click(function () {
    $(this).next().stop().slideToggle().parent().sibling().children('ul').slideUp();
   })
  })
 


 
  
  • 
   水果
   
    
  • 苹果
    • 
    
  • 梨子
    • 
    
  • 葡萄
    • 
    
  • 火龙果
    • 
   
  
  
  • 
   海鲜
   
      
    
    • 鱼
      • 
    
    • 扇贝
      • 
    
    • 龙虾
      • 
    
    • 象牙蚌
      • 
   
    
  
    • 
  
  • 
   肉类
   
      
    
    • 牛肉
      • 
    
    • 猪肉
      • 
    
    • 肌肉
      • 
   
    
  
    • 
 

    关于使用JQuery怎么实现链式调用就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。


    分享标题：使用JQuery怎么实现链式调用
    转载来于：http://njwzjz.com/article/pcidgd.html

    其他资讯