栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Java

jQuery项目案例

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

jQuery项目案例

文章目录
    • 1、动态添加和删除数据
    • 2、微博发布
    • 3、移动水果
    • 4、上下拉切换
    • 5、精品演示
    • 6、tab标签切换
    • 7、突出显示
    • 8、下拉菜单
    • 9、页面滚动
    • 10、王者手风琴
  • 总结

1、动态添加和删除数据

案例演示:

实现步骤:
val()获取值,tr添加设置内容,append内部添加,slideDown向下滑动,val()清空



  
    
    jQuery动态添加和删除数据
    
    
  
  
      
课程名称: 所属学院:
课程名称 所属学院 已学会
JavaScript 信息工程系 删除
css 信息工程系 删除
html 信息工程系 删除
jQuery 信息工程系 删除
2、微博发布

案例演示:

实现步骤:





    
    
    
	
    



    
微博发布
3、移动水果

案例演示:

实现步骤:




    
    Document
    
	
    



    

    
    
    
    

    




4、上下拉切换

案例演示:

实现步骤:



	
		
		
	
	
	
	
		
		
		
		
5、精品演示

案例演示:

实现步骤:
获取下标,对应内容通过下标show,其他hide



	
		
		
	
	
	





    
    
    
    
    



    



6、tab标签切换

案例演示:

实现步骤:




    
    
    
    Document
	
    



    
  • 商品介绍
  • 规格与包装
  • 售后保障
  • 商品评价(50000)
  • 手机社区
商品介绍模块内容
规格与包装模块内容
售后保障模块内容
商品评价(50000)模块内容
手机社区模块内容
7、突出显示

案例演示:

实现步骤:
触碰透明度0.5 离开透明度 1 (opacity)





    
    
    

    



    












8、下拉菜单

案例演示:

实现步骤:



	
		
		
		
	
	
		
		
	


9、页面滚动

案例演示:

实现步骤:





    
    
    
    Document
    
    



    
返回顶部
10、王者手风琴

案例演示:

实现步骤:





    
    手风琴案例

    




    
    
    







总结

li:first li:last li:eq(2) li:odd --奇数 li:even --偶数
ul li --子代
ul

  • hide()
    show()

    siblings()
    $(this).index()
    .click
    .mouseover
    .mouseout

    addClass()
    removeClass()
    css(“background”,“red”)

    slideDown()
    slideUp()
    slideToggle()
    hover()

    animite()
    fadeIn()
    fadeOut()
    fadeTo(“show”,0.5)

    each(function(index,element))
    $.extend(a,b)
    $.extend(true,a,b)
    on({click:function(){}})
    on(“”,“”,function(){})

    append() repend() before() after() remove() after()
    val() text() html()
    offset().top offset().left postion() postion().top
    $(document).scrollTop()
    $(window).scroll()
    $(“body,html”).animate({})

    prop()
    prop(“”,“”) --固有属性
    attr()
    attr(“”,“”)–自定义属性
    checked --固有属性

  • 转载请注明:文章转载自 www.mshxw.com
    本文地址:https://www.mshxw.com/it/995267.html
    我们一直用心在做
    关于我们 文章归档 网站地图 联系我们

    版权所有 (c)2021-2022 MSHXW.COM

    ICP备案号:晋ICP备2021003244-6号