【无标题】

服务器端如何将数据变为JSON字符串:
    PHP:echo JSON_encode($arr);
    Node:JSON.stringify(arr);

   前端如何将JSON字符串拿到变为JSON对象:
    1、eval("("+json字符串+")");
    2、JSON.parse(json字符串);

事件:用户触发 或 浏览器自动触发:
   绑定:$("xx").bind("事件名",callback);
   简化:$("xx").事件名(callback);

   面试题:原生JS中 window.onload 和 JQ中$(document).ready(callback) 有什么区别
    1、window.onload:等待所有的资源(html、css、js、图片、视频、音频)加载完毕后,最后执行,而且一个页面只能使用一次
    2、$(document).ready(callback):等待DOM树加载完毕就会执行,理论上比上者效率更高,而且一个页面可以反复使用
        简写:1、$(document).ready(()=>{})
              2、$().ready(()=>{})
              3、$(()=>{})

   原来学过的事件:click、dblclick、mouseover/mouseenter(移入,不会触发冒泡)、mouseout/mouseleave(移出,不会触发冒泡)、mousemove、change、blur、focus、submit、input(只要用户输入就会触发)、
           contextmenu、resize、keydown

   
    mousedown(鼠标按下)、mouseup(鼠标松开)

    keydown、keypress、keyup - 键盘事件:
        $(window).键盘事件(callback);
        keydown:按下和按住都会触发,任何按键都支持 - 最适合用于做(游戏开发) 
        keypress:按下和按住都会触发,支持数字+字母+回车+空格
        keyup:松开时才触发,任何按键都支持 - 劲舞、炫舞、QQ音速,比手速

        event事件对象:jQuery没有任何的简化操作
            键盘键码:e.keyCode;

    scroll - 滚动监听事件:
        绑定事件:$(window).scroll(()=>{
                1、$(window).scrollTop();//获取当前滚动条距离页面顶部有多远

                2、$("xx").offset().top;//获取某个元素距离页面顶部有多远

                3、越往下滚,出现数据越多
              })


2、JQ动画:
   1、预定义动画:3组:9个
    1、隐藏和显示:
       隐藏:$("xx").hide(执行时间,callback)
       显示:$("xx").show(执行时间,callback)
       特殊:1、如果没有传递任何参数,瞬间的隐藏和显示
            如果传递了时间参数,会具有动画(同时修改宽高度、透明度)
          2、callback是动画执行完毕才会执行的代码操作
         3、组合用法:自带判断操作:
            $("xx").toggle(执行时间,callback) === show+hide

    2、滑动效果:
       隐藏:$("xx").slideUp(执行时间,callback)
       显示:$("xx").slideDown(执行时间,callback)
       特殊:1、哪怕不加时间也具有动画,只不过动画比较快(修改高度)
          2、callback是动画执行完毕才会执行的代码操作
         3、组合用法:自带判断操作:
            $("xx").slideToggle(执行时间,callback) === slideDown+slideUp

    3、淡入淡出:
       淡出/隐藏:$("xx").fadeOut(执行时间,callback)
       淡入/显示:$("xx").fadeIn(执行时间,callback)
       特殊:1、哪怕不加时间也具有动画,只不过动画比较快(修改透明度)
          2、callback是动画执行完毕才会执行的代码操作
         3、组合用法:自带判断操作:
            $("xx").fadeToggle(执行时间,callback) === fadeIn+fadeOut

   2、自定义动画:
    1、并发动画:所有的动画一起执行
        $("xx").animate({
            "css属性名":"css属性值",
            ...
        },执行时间,callback)

    2、排队动画:一个动画做完在做下一个
        $("xx").animate({
            "css属性名":"css属性值",
        },执行时间,callback).animate({
            "css属性名":"css属性值",
        },执行时间,callback).animate({
            "css属性名":"css属性值",
        },执行时间,callback).animate({
            "css属性名":"css属性值",
        },执行时间,callback).animate({
            "css属性名":"css属性值",
        },执行时间,callback).animate({
            "css属性名":"css属性值",
        },执行时间,callback)

    特殊:
      1、animate方法不支持颜色、transform转换的动画 - 明天就有jQuery.ui.js提供增强animate方法
      2、动画会排队,如果快速的触发动画,怎么排队上很多很多的动画慢慢执行,不希望看到这个效果:
        stop();


    扩展:如何判断某个元素的有没有动画
         if(!$("xx").is(":animated")){没有动画的元素才执行}
    
        
         if(!$("xx").is(":hidden")){没有隐藏的元素才执行}

、jQueryUI:组件/插件库:提供了HTML/CSS/JS,程序员想要使用只需要引入然后梭代码
         组件:组成网页一部分的部件
         插件:插件就是组件,插件带有js功能

   一切插件的使用步骤:
    1、下载
    2、引入:
       <link rel="stylesheet" type="text/css" href="jquery-ui-1.13.0.custom/jquery-ui.css"/>
       <script src="jquery-ui-1.13.0.custom/external/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>
       <script src="jquery-ui-1.13.0.custom/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值