zoukankan      html  css  js  c++  java
  • JQuery

    JQuery
    JQuery语法
    * 1、JQuery("选择器").action();通过选择器调用事件函数
    * 但jquery中,JQuery可以用$符号代替,用$("选择器").action();
    * ①选择器,可以直接使用css选择器,选中元素
    * ②.action()表示对元素执行的操作
    *
    * 2、文档就绪函数:防止了文档在完全加载(就绪)之前执行jquery代码
    *
    * $(document).ready(function(){
    $("p").hide();
     
    $("p").fadeIn(5000);
    });
    简写形式
    $(function(){
    $("p").hide();
     
    $("p").fadeIn(5000);
    })
     
    【文档就绪函数&window.onload区别】
    ①window.onload需在网页所有内容加载完后执行
    文档就绪函数,只需加载完DOM后便执行
    ②window.onload只能写一个,写多个只会执行最后一个
    文档就绪函数,写多个也不会被覆盖
    3、Jquery对象与原生DOM对象互转
    ①原生DOM对象转为Jquery对象:$(DOM对象);
    var p1= document.getElementById("p1");
    $(p1);//转换
     
    * ②Jquery对象转原生DOM对象:$("#p").get(0) $("#p")[0]
    * $("#p").get(0).style.color="red";
     
    调用的方式和函数的不同之处
     
    【事件绑定快捷方式】
    *
    * $("button:first").click(function(){
    alert("1")
    })
    */
     
    /*使用on绑定事件
    * $("button").on("click",function(){
    console.log($(this).html());
    });
    */
     
    /*使用on同时绑定多个事件,绑定同一函数
    * $("button").on("mouseover click",function(){
    console.log($(this).html());
    });
    */
     
    //调用函数时,传入自定义参数
    /*$("button").on("click",{name:"jianghao"},function(event){
    console.log(event.date.name);
    });*/
     
     
    /*使用on进行多事件多函数绑定
    * $("button").on({
    click:function(){
    console.log("click")
    },
    mouseover:function(){
    console.log("mouseover")
    }
    });
    *
    */
     
    //使用on进行事件委派
    /*>>>子元素要触发的事件委托给给某一事件处理
    * 作用:默认的绑定事件只能对该绑定的元素有效,使用事件委派,可以对新元素有效
    */
     
    /*$(document).on("click","button",function(){
    alert(1)
    })*/
     
    /*$("button").on("click",function(){
    var p=$("<p>123456</p>");
    $("p").after(p);
    });
    $(document).on("click","p",function(){
    alert(1)
    });*/
     
    /*off()取消事件绑定
    *
    * 1、$("p").off():取消所有事件
    * 2、$("p").off("click"):取消点击事件
    * 3、$("p").off("click mouseover"):取消多个事件
    * 4、$(document).off("click","p"):取消事件委派
    */
     
    //使用.one()绑定事件,只能执行一次
    /*$("button").one("click",function(){
    alert(1)
    });*/
     
    /*$("p").click(function(event,arg1,arg2){
    alert("触发了p的点击事件"+arg1+arg2);
    });
     
    $("button").click(function(){
    $("p").trigger("click",["haha","hehe"]);
    });*/
    /*---------------------------------*/
     
     
    /*show()
    *
    * ①不传参:让隐藏的元素直接显示,不进行动画
    * ②传入时间:毫秒
    *
    * .show()动画执行效果,修改元素的宽度,高度,opcity属性
    *
    * .hide():让显示效果隐藏,与show相反
    *
    * .slidedown():让隐藏元素显示,从上往下
    * .slideup():让隐藏元素显示,从下往上
    * .slideToggle():让显示隐藏,隐藏的显示
    * .fadeIn():让隐藏的淡出
    * .fadeOut()
    * .fadeToggle():让显示的隐藏,隐藏的显示,淡入淡出
    * .fadeToggle(时间,透明度,函数):多了透明度,可以指定透明度
    * .animate(最终的样式属性键对值)
    */
     
    /*$("p").show(5000,function(){
    alert(1)
    });*/
     
    /*$("p").slideDown(5000,function(){
    alert(1)
    });*/
     
    /*$("p").fadeIn(5000);*/
    HTTP:超文本传输协议。
    *
    * URL:统一资源定位符
    * 组成: 协议名://主机名(IP地址):端口号/项目资源地址?传递参数键值对#锚点
    * eg: http://127.0.0.1:8080/jd/index.html?name=jianghao
    *
    * localhost或127.0.0.1表示本机IP
    *
    */
     
    /* JSON 对象
    *
    * 1、JSON对象是键值对的集合,键与值之间用":"分隔,多个键值对之间,用","分隔
    * 2、多个JSON对象,可以放到数组中去。JSON对象和数组,可以相互嵌套;
    *
    * JSON的键,必须是字符串。
  • 相关阅读:
    Spring MVC 学习总结(五)——校验与文件上传
    Spring MVC 学习总结(四)——视图与综合示例
    Spring学习总结(二)——静态代理、JDK与CGLIB动态代理、AOP+IoC
    Spring MVC 学习总结(二)——控制器定义与@RequestMapping详解
    Spring学习总结(六)——Spring整合MyBatis完整示例
    Spring MVC 学习总结(一)——MVC概要与环境配置(IDea与Eclipse示例)
    Spring集成MyBatis完整示例
    Spring学习总结(五)——Spring整合MyBatis(Maven+MySQL)二
    Spring学习总结(五)——Spring整合MyBatis(Maven+MySQL)一
    Android自动连接指定的wifi,免密码或指定密码
  • 原文地址:https://www.cnblogs.com/zhang11424/p/6754514.html
Copyright © 2011-2022 走看看