jquery学习笔记

jQuery与js的却别就是:js是自己定义函数,然后去调用;jquery就是定义函数,在函数中定义谁的功能是什么。
    jQuery 语法是通过选取 HTML 元素,并对选取的元素执行某些操作。
    实例中的所有 jQuery 函数位于一个 document ready 函数中:这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码,即在 DOM 加载完成后才可以对 DOM 进行操作,
        $(function(){                                        $(document).ready(   function(){    //执行代码});
        $("p").click(function{
        $("p").hide();
        });
        });
    jquery  选择器  允许您对html元素组或单个元素进行操作。基于元素的id,类,类型,属性,属性值等“查找”(或选择)元素。
            jquery中所有的选择器都得一美元符号开头:$()。一般是一个事件触发后,会带来什么样的功能-function
        
    jQuery 的事件           --事件的触发会有功能的实现,一般都是事件后面跟功能(function(){})
            鼠标事件: click   dblclick  mouseenter   mouseleave
            键盘事件: keypress  keydown  keyup  hover
            表单事件: submit  change  focus blur  
            文档/窗口事件: load  resize  scroll  unload
                
                语法 show  与 hide 都是有参数的 , (speed,callback)
                有一个函数可以代替  show 与 hide  ,是 toggle   (speed,callback)
                
    jQuery 效果  ---淡入淡出
            fadeIn()   用于淡入已隐藏的元素
            fadeOut()   用与淡出可见的元素          淡入淡出都是基于屏幕来说的
            fadeToggle()  方法可用于淡入淡出的效果
            fadeTo()  方法允许渐变为给定的不透明度(值介于0和1之间)
    
    jQuery 效果  ----滑动
            slideDown()       向下滑动元素
            slideUp()            向上滑动元素
            slideToggle()        同时实现向上或者向下滑动元素
    
    jQuery  效果 ----动画
            使用的函数是   animate()   方法中可以有多个参数
            
    jQuery  停止动画
            使用幻术 stop()     使用与所有jquery效果函数,包括 滑动,淡入淡出,和自定义动画。
            
    jQuery callback
            callback函数在当前动画100%完成之后执行
            这个函数没有具体的函数名,只是在使用 其他动画函数(function)中添加参数来实现
            
    jQuery  ---链(chaining)
            jquery可以把动作方法连接在一起,可以允许在一条语句中运行多个jquery方法。
            
    jQuery 获取内容和属性
            jquery拥有可操作html元素和属性的强大方法。就是操作DOM的能力。
        
        获得的内容 ————  包括   
            text()   设置 或 返回 所选元素的文本内容            
            html()   设置 或 返回 所选元素的内容(包括html标记)
            val()。  设置 或 返回 表单字段的值              $("#btn1").click(function(){alert("值为: " + $("#test").val());});
        获取属性 ----attr()    用于获取 或者  设置 属性值。
            
    jQuery 设置内容和属性
            还是使用上面三个函数,区别就是 所用的函数中是否有参数 ,有参数就是进行设置,没有参数就是进行获取。
 
    jQuery ---添加元素
            添加新内容的四个方法。
            append()            在被选元素的结尾插入内容(让在该元素的内部)
            prepend()          在被选元素的开头插入内容
            after()            在被选元素之后插入内容    
            before()            在被选元素之前插入内容
        区别 ::append/prepend   是在选择元素内部嵌入
                after/before   是在元素外面追加
                
    jQuery    ---移除元素
            remove ()  --删除被选元素(及其子元素)      当然 remove 方法中 可以接受参数,允许对被删除元素进行过滤
            empty( )   -- 从被选元素中删除子元素            empty 方法 不可以进行过滤
            
    
    jQuery   ----获取并设置css类
            addClass()   --向被选元素添加一个或多个类
            removeClass()  --从被选元素删除一个或多个类
            toggleClass()   --对被选元素进行添加或者删除类的切换操作
            css()            --设置或返回样式属性,通过参数来设置或者获取属性
    jQuery 的遍历      
            遍历就是获取指定元素的父类或者子类。
        过滤 ---
            first()           选取第一个元素
            last()            选取最后一个元素
            eq()                返回被选元素中带有指定索引号的元素,索引号从 0 开始
           其他的过滤方法,比如 filter()和not()允许选取匹配或不匹配某项指定标准的元
    jQuery  ---AJAX load() 方法   load方法从服务器加载数据,并把返回的数据放入被选元素
            load(url,data,callback)url 是必须的参数,data与callback是可选的参数
                                        也可以把url中的某一个标签加载进去。
                
            ajax 的get()和post()方法
                get(url,callback)     url是必须的,callback是可选的,是请求成功后所执行的函数名。
                post(url,data,callback)  url的必须的,其他的参数都是可选的。
                
    在页面上使用jQuery时,如果其他的框架也使用 $ 符号作为简写,发生了冲突,会导致脚本停止运行
        jQuery会使用 noConflict() 方法释放对 $ 符号符的控制。
        
        解决冲突的问题:使用jQuery的去全名去代替简写        jQuery(document).ready(function(){
                        创建自己的简写                       var jq = $.noConflict();   jq(document).ready(function(){
                        将 $ 符号作为变量传递给ready方法,可以在函数内使用 $ 符号,但是在函数外,必须使用全名--jQuery 。  jQuery(document).ready(function($){
            
 
在加载页面的同时利用js或者jquery进行后台的数据查询
可以用 jquery ajax 异步 实现
$.ajax({
type: "POST",
url: 请求路径 如 “/asmx/1.asmx/HelloWorld”,
data: 传输参数 要看请求类型 每个返回参数类型不同参数格式不一样,
dataType: 返回参数类型 如 "html、json "等,
beforeSend: function (XMLHttpRequest) {
$("#divlist").html("正在加载数据");
}    
 
***jQuery中实现点击效果的四种不同的写法(jquery中没有onclick事件)
        1.$(".tab").click(function () {  })
        2.$(".tab").on("click",function () {  })
        3.$(document).on("click", ".tab",function () {  })
        4.使用<onclick="">触发函数
四种方法的可行度:3>2>1>4
jquery中的jQuery.on()同时绑定多个事件的写法
            $(".class").on({
           click:function(){
               //回调
           },
           mouseover:function(){
               //回调
           },
           mouseout:function(){
               //回调
           }
        })
 
原文地址:https://www.cnblogs.com/zylong1220/p/11833326.html