zoukankan      html  css  js  c++  java
  • 对JQuery中Ajax应用与jQuery插件的理解与笔记

    Ajax有原生的和封装jQuery版的,感觉JQuery的写法比较简洁明了,不需要去兼容浏览器。

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="UTF-8">
     5         <title></title>
     6     </head>
     7     <body>
     8         <input type="button" value="测试" />
     9     </body>
    10     <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
    11     <script type="text/javascript">
    12         $(function(){
    13             $.ajax({
    14                 type:"get",//提交数据方式
    15                 url:"",//提交路径
    16                 async:true//是否异步
    17                 data://数据类型
    18             });
    19         });
    20     </script>
    21 </html>

    jQuery插件就更有意思了,是一个比较方便的工具,减少开发项目的周期。

    自定义jQuery插件的一种方式 ,这种属于类里面添加方法,给对象调用。还有一种属于类调用,类似于静态方法,

    ;(function(){
            $.fn.extend({
                "color":function(value){
                    return this.css("background-color",value);
                }
            });
    })(jQuery);
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <body>
            <input type="text" />
            <input type="button" value="变色" />
        </body>
        <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
        <script type="text/javascript" src="js/jquery.color.js" ></script>
        <script type="text/javascript">
            $(function(){
                $("input[type=button]").click(function(){
                    $("input[type=text]").color($("input[type=text]").val());
                });
            });
        </script>
    </html>

    在插件内部,this指向的是当前通过选择器获取的jQuery对象,而不像一般的方法那样,例如click()方法,内部的this指向的是DOM元素。

    可以通过this.each来遍历所有元素。

  • 相关阅读:
    重新进入学习模式
    第八章 函数
    第七章 用户输入和while语句
    第6章 字典
    第五章 if语句
    对前四章方法、函数、语句的总结
    完成四个章节的学习,我觉得有必要花一天的时间对各章节内的函数、方法、语句进行总结。明后天不再对新章节进行学习。
    第四章 操作列表
    第三章 列表简介
    C语言数据结构-折半查找
  • 原文地址:https://www.cnblogs.com/chyxOne/p/8982534.html
Copyright © 2011-2022 走看看