前端基础之jquery
 

一 jQuery是什么？

［1］   jQuery由美国人John Resig创建，至今已吸引了来自世界各地的众多 javascript高手加入其team。

［2］   jQuery是继prototype之后又一个优秀的Javascript框架。其宗旨是——WRITE LESS,DO MORE!

［3］  它是轻量级的js库(压缩后只有21k) ，这是其它的js库所不及的，它兼容CSS3，还兼容各种浏览器

［4］  jQuery是一个快速的，简洁的javaScript库，使用户能更方便地处理HTMLdocuments、events、实现动画效果，并且方便地为网站提供AJAX交互。

［5］  jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。

二 什么是jQuery对象？

jQuery 对象就是通过jQuery包装DOM对象后产生的对象。jQuery 对象是 jQuery 独有的. 如果一个对象是 jQuery 对象, 那么它就可以使用 jQuery 里的方法: $(“#test”).html();

  1. $("#test").html() 
     
  2.          意思是指：获取ID为test的元素内的html代码。其中html()是jQuery里的方法 
  3.  
  4.          这段代码等同于用DOM实现代码： document.getElementById(" test ").innerHTML; 
  5.  
  6.          虽然jQuery对象是包装DOM对象后产生的，但是jQuery无法使用DOM对象的任何方法，同理DOM对象也不能使用jQuery里的方法.乱使用会报错
  7.  
  8.          约定：如果获取的是 jQuery 对象, 那么要在变量前面加上$. 
  9.  
  10. var $variable = jQuery 对象
  11. var variable = DOM 对象
  12.  
  13. $variable[0]：jquery对象转为dom对象      $("#msg").html(); $("#msg")[0].innerHTML

jquery的基础语法：$(selector).action()

参考：http://jquery.cuishifeng.cn/

三 寻找元素(选择器和筛选器)

3.1   选择器

3.1.1 基本选择器

  1. $("*")  $("#id")   $(".class")  $("element")  $(".class,p,div")

3.1.2 层级选择器

  1. $(".outer div")  $(".outer>div")   $(".outer+div")  $(".outer~div")

3.1.3 基本筛选器　　

  1. $("li:first")  $("li:eq(2)")  $("li:even") $("li:gt(1)")

3.1.4 属性选择器

  1. $('[id="div1"]')   $('["alex="sb"][id]')

3.1.5 表单选择器

  1. $("[type='text']")----->$(":text")         注意只适用于input标签  : $("input:checked")

3.1.6 表单属性选择器

  1.     :enabled
  2.     :disabled
  3.     :checked
  4.     :selected
  1. <body>
  2.  
  3. <form>
  4.     <input type="checkbox" value="123" checked>
  5.     <input type="checkbox" value="456" checked>
  6.  
  7.   <select>
  8.       <option value="1">Flowers</option>
  9.       <option value="2" selected="selected">Gardens</option>
  10.       <option value="3" selected="selected">Trees</option>
  11.       <option value="3" selected="selected">Trees</option>
  12.   </select>
  13. </form>
  14.  
  15. <script src="jquery.min.js"></script>
  16. <script>
  17.     // console.log($("input:checked").length);     // 2
  18.  
  19.     // console.log($("option:selected").length);   // 只能默认选中一个,所以只能lenth:1
  20.  
  21.     $("input:checked").each(function(){
  22.  
  23.         console.log($(this).val())
  24.     })
  25.  
  26. </script>
  27.  
  28. </body>

3.2 筛选器

3.2.1  过滤筛选器

  1. $("li").eq(2)  $("li").first()  $("ul li").hasclass("test")

3.2.2  查找筛选器　　

  1.  查找子标签：         $("div").children(".test")      $("div").find(".test")  
  2.  
  3.  向下查找兄弟标签：    $(".test").next()               $(".test").nextAll()     
                        $(".test").nextUntil() 
  4.  
  5.  向上查找兄弟标签：    $("div").prev()                  $("div").prevAll()       
                        $("div").prevUntil()
  6.  查找所有兄弟标签：    $("div").siblings()  
     
  7.  查找父标签：         $(".test").parent()              $(".test").parents()     
                        $(".test").parentUntil()

四 操作元素(属性，css，文档处理)

4.1 事件

页面载入

  1. ready(fn)  // 当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
  2. $(document).ready(function(){}) -----------> $(function(){})　　

事件绑定

  1. //语法:  标签对象.事件(函数)
  2. eg: $("p").click(function(){})

事件委派：

  1. $("").on(eve,[selector],[data],fn)  // 在选择元素上绑定一个或多个事件的事件处理函数。
  1. <ul>
  2.     <li>1</li>
  3.     <li>2</li>
  4.     <li>3</li>
  5. </ul>
  6. <hr>
  7. <button id="add_li">Add_li</button>
  8. <button id="off">off</button>
  9.  
  10. <script src="jquery.min.js"></script>
  11. <script>
  12.     $("ul li").click(function(){
  13.         alert(123)
  14.     });
  15.  
  16.     $("#add_li").click(function(){
  17.         var $ele=$("<li>");
  18.         $ele.text(Math.round(Math.random()*10));
  19.         $("ul").append($ele)
  20.  
  21.     });
  22.  
  23. //    $("ul").on("click","li",function(){
  24. //        alert(456)
  25. //    })
  26.  
  27.      $("#off").click(function(){
  28.          $("ul li").off()
  29.      })
  30.  
  31. </script>

事件切换

hover事件：

一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。这是一个自定义的方法，它为频繁使用的任务提供了一种“保持在其中”的状态。

over:鼠标移到元素上要触发的函数

out:鼠标移出元素要触发的函数

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <style>
  7.         *{
  8.             margin: 0;
  9.             padding: 0;
  10.         }
  11.         .test{
  12.  
  13.             width: 200px;
  14.             height: 200px;
  15.             background-color: wheat;
  16.  
  17.         }
  18.     </style>
  19. </head>
  20. <body>
  21.  
  22. <div class="test"></div>
  23. </body>
  24. <script src="jquery.min.js"></script>
  25. <script>
  26. //    function enter(){
  27. //        console.log("enter")
  28. //    }
  29. //    function out(){
  30. //        console.log("out")
  31. //    }
  32. // $(".test").hover(enter,out)
  33.  
  34. $(".test").mouseenter(function(){
  35.         console.log("enter")
  36. });
  37.  
  38. $(".test").mouseleave(function(){
  39.         console.log("leave")
  40.     });
  41.  
  42. </script>
  43. </html>

4.2 属性操作

  1. --------------------------CSS类
  2. $("").addClass(class|fn)
  3. $("").removeClass([class|fn])
  4. --------------------------属性
  5. $("").attr();
  6. $("").removeAttr();
  7. $("").prop();
  8. $("").removeProp();
  9. --------------------------HTML代码/文本/值
  10. $("").html([val|fn])
  11. $("").text([val|fn])
  12. $("").val([val|fn|arr])
  13. ---------------------------
  14. $("#c1").css({"color":"red","fontSize":"35px"})

attr方法使用：

  1. <input id="chk1" type="checkbox" />是否可见
  2. <input id="chk2" type="checkbox" checked="checked" />是否可见
  3.  
  4. <script>
  5.  
  6. //对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
  7. //对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。
  8. //像checkbox，radio和select这样的元素，选中属性对应“checked”和“selected”，这些也属于固有属性，因此
  9. //需要使用prop方法去操作才能获得正确的结果。
  10.  
  11. //    $("#chk1").attr("checked")
  12. //    undefined
  13. //    $("#chk1").prop("checked")
  14. //    false
  15.  
  16. //  ---------手动选中的时候attr()获得到没有意义的undefined-----------
  17. //    $("#chk1").attr("checked")
  18. //    undefined
  19. //    $("#chk1").prop("checked")
  20. //    true
  21.  
  22.     console.log($("#chk1").prop("checked"));//false
  23.     console.log($("#chk2").prop("checked"));//true
  24.     console.log($("#chk1").attr("checked"));//undefined
  25.     console.log($("#chk2").attr("checked"));//checked
  26. </script>

4.3 each循环

我们知道，

  1. $("p").css("color","red")　　

是将css操作加到所有的标签上，内部维持一个循环；但如果对于选中标签进行不同处理，这时就需要对所有标签数组进行循环遍历啦

jquery支持两种循环方式：

方式一

格式：$.each(obj,fn)

  1. li=[10,20,30,40];
  2. dic={name:"yuan",sex:"male"};
  3. $.each(li,function(i,x){
  4.     console.log(i,x)
  5. });

方式二

格式：$("").each(fn)

  1. $("tr").each(function(){
  2.     console.log($(this).html())
  3. })

其中,$(this)代指当前循环标签。

each扩展

  1. /*
  2.         function f(){
  3.  
  4.         for(var i=0;i<4;i++){
  5.  
  6.             if (i==2){
  7.                 return
  8.             }
  9.             console.log(i)
  10.         }
  11.  
  12.     }
  13.     f();  // 这个例子大家应该不会有问题吧!!!
  14. //-----------------------------------------------------------------------
  15.  
  16.     li=[11,22,33,44];
  17.     $.each(li,function(i,v){
  18.  
  19.         if (v==33){
  20.                 return ;   //  ===试一试 return false会怎样?
  21.             }
  22.             console.log(v)
  23.     });
  24.  
  25. //------------------------------------------
  26.  
  27.     // 大家再考虑: function里的return只是结束了当前的函数,并不会影响后面函数的执行
  28.  
  29.     //本来这样没问题,但因为我们的需求里有很多这样的情况:我们不管循环到第几个函数时,一旦return了,
  30.     //希望后面的函数也不再执行了!基于此,jquery在$.each里又加了一步:
  31.          for(var i in obj){
  32.  
  33.              ret=func(i,obj[i]) ;
  34.              if(ret==false){
  35.                  return ;
  36.              }
  37.  
  38.          }
  39.     // 这样就很灵活了:
  40.     // <1>如果你想return后下面循环函数继续执行,那么就直接写return或return true
  41.     // <2>如果你不想return后下面循环函数继续执行,那么就直接写return false
  42.  
  43. // ---------------------------------------------------------------------

4.4 文档节点处理

  1. //创建一个标签对象
  2.     $("<p>")
  3.  
  4. //内部插入
  5.  
  6.     $("").append(content|fn)      ----->$("p").append("<b>Hello</b>");
  7.     $("").appendTo(content)       ----->$("p").appendTo("div");
  8.     $("").prepend(content|fn)     ----->$("p").prepend("<b>Hello</b>");
  9.     $("").prependTo(content)      ----->$("p").prependTo("#foo");
  10.  
  11. //外部插入
  12.  
  13.     $("").after(content|fn)       ----->$("p").after("<b>Hello</b>");
  14.     $("").before(content|fn)      ----->$("p").before("<b>Hello</b>");
  15.     $("").insertAfter(content)    ----->$("p").insertAfter("#foo");
  16.     $("").insertBefore(content)   ----->$("p").insertBefore("#foo");
  17.  
  18. //替换
  19.     $("").replaceWith(content|fn) ----->$("p").replaceWith("<b>Paragraph. </b>");
  20.  
  21. //删除
  22.  
  23.     $("").empty()
  24.     $("").remove([expr])
  25.  
  26. //复制
  27.  
  28.     $("").clone([Even[,deepEven]])

4.5 动画效果

显示隐藏

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <script src="jquery-2.1.4.min.js"></script>
  7.     <script>
  8.  
  9. $(document).ready(function() {
  10.     $("#hide").click(function () {
  11.         $("p").hide(1000);
  12.     });
  13.     $("#show").click(function () {
  14.         $("p").show(1000);
  15.     });
  16.  
  17. //用于切换被选元素的 hide() 与 show() 方法。
  18.     $("#toggle").click(function () {
  19.         $("p").toggle();
  20.     });
  21. })
  22.  
  23.     </script>
  24.     <link type="text/css" rel="stylesheet" href="style.css">
  25. </head>
  26. <body>
  27.  
  28.     <p>hello</p>
  29.     <button id="hide">隐藏</button>
  30.     <button id="show">显示</button>
  31.     <button id="toggle">切换</button>
  32.  
  33. </body>
  34. </html>

滑动

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <script src="jquery-2.1.4.min.js"></script>
  7.     <script>
  8.     $(document).ready(function(){
  9.      $("#slideDown").click(function(){
  10.          $("#content").slideDown(1000);
  11.      });
  12.       $("#slideUp").click(function(){
  13.          $("#content").slideUp(1000);
  14.      });
  15.       $("#slideToggle").click(function(){
  16.          $("#content").slideToggle(1000);
  17.      })
  18.   });
  19.     </script>
  20.     <style>
  21.  
  22.         #content{
  23.             text-align: center;
  24.             background-color: lightblue;
  25.             border:solid 1px red;
  26.             display: none;
  27.             padding: 50px;
  28.         }
  29.     </style>
  30. </head>
  31. <body>
  32.  
  33.     <div id="slideDown">出现</div>
  34.     <div id="slideUp">隐藏</div>
  35.     <div id="slideToggle">toggle</div>
  36.  
  37.     <div id="content">helloworld</div>
  38.  
  39. </body>
  40. </html>

淡入淡出

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <script src="jquery-2.1.4.min.js"></script>
  7.     <script>
  8.     $(document).ready(function(){
  9.    $("#in").click(function(){
  10.        $("#id1").fadeIn(1000);
  11.  
  12.    });
  13.     $("#out").click(function(){
  14.        $("#id1").fadeOut(1000);
  15.  
  16.    });
  17.     $("#toggle").click(function(){
  18.        $("#id1").fadeToggle(1000);
  19.  
  20.    });
  21.     $("#fadeto").click(function(){
  22.        $("#id1").fadeTo(1000,0.4);
  23.  
  24.    });
  25. });
  26.  
  27.     </script>
  28.  
  29. </head>
  30. <body>
  31.       <button id="in">fadein</button>
  32.       <button id="out">fadeout</button>
  33.       <button id="toggle">fadetoggle</button>
  34.       <button id="fadeto">fadeto</button>
  35.  
  36.       <div id="id1" style="display:none; width: 80px;height: 80px;background-color: blueviolet"></div>
  37.  
  38. </body>
  39. </html>

回调函数

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <script src="jquery-2.1.4.min.js"></script>
  7.  
  8. </head>
  9. <body>
  10.   <button>hide</button>
  11.   <p>helloworld helloworld helloworld</p>
  12.  
  13.  <script>
  14.    $("button").click(function(){
  15.        $("p").hide(1000,function(){
  16.            alert($(this).html())
  17.        })
  18.  
  19.    })
  20.     </script>
  21. </body>
  22. </html>

4.6 css操作

css位置操作

  1.         $("").offset([coordinates])
  2.         $("").position()
  3.         $("").scrollTop([val])
  4.         $("").scrollLeft([val])

示例1：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <style>
  7.         .test1{
  8.             width: 200px;
  9.             height: 200px;
  10.             background-color: wheat;
  11.         }
  12.     </style>
  13. </head>
  14. <body>
  15.  
  16. <h1>this is offset</h1>
  17. <div class="test1"></div>
  18. <p></p>
  19. <button>change</button>
  20. </body>
  21. <script src="jquery-3.1.1.js"></script>
  22. <script>
  23.     var $offset=$(".test1").offset();
  24.     var lefts=$offset.left;
  25.     var tops=$offset.top;
  26.  
  27.     $("p").text("Top:"+tops+" Left:"+lefts);
  28.     $("button").click(function(){
  29.  
  30.         $(".test1").offset({left:200,top:400})
  31.     })
  32. </script>
  33. </html>

示例2:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <style>
  7.         *{
  8.             margin: 0;
  9.         }
  10.         .box1{
  11.             width: 200px;
  12.             height: 200px;
  13.             background-color: rebeccapurple;
  14.         }
  15.         .box2{
  16.             width: 200px;
  17.             height: 200px;
  18.             background-color: darkcyan;
  19.         }
  20.         .parent_box{
  21.              position: relative;
  22.         }
  23.     </style>
  24. </head>
  25. <body>
  26.  
  27. <div class="box1"></div>
  28. <div class="parent_box">
  29.     <div class="box2"></div>
  30. </div>
  31. <p></p>
  32.  
  33. <script src="jquery-3.1.1.js"></script>
  34. <script>
  35.     var $position=$(".box2").position();
  36.     var $left=$position.left;
  37.     var $top=$position.top;
  38.  
  39.     $("p").text("TOP:"+$top+"LEFT"+$left)
  40. </script>
  41. </body>
  42. </html>

示例3:

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.  
  7.     <style>
  8.         body{
  9.             margin: 0;
  10.         }
  11.         .returnTop{
  12.             height: 60px;
  13.             width: 100px;
  14.             background-color: peru;
  15.             position: fixed;
  16.             right: 0;
  17.             bottom: 0;
  18.             color: white;
  19.             line-height: 60px;
  20.             text-align: center;
  21.         }
  22.         .div1{
  23.             background-color: wheat;
  24.             font-size: 5px;
  25.             overflow: auto;
  26.             width: 500px;
  27.             height: 200px;
  28.         }
  29.         .div2{
  30.             background-color: darkgrey;
  31.             height: 2400px;
  32.         }
  33.  
  34.         .hide{
  35.             display: none;
  36.         }
  37.     </style>
  38. </head>
  39. <body>
  40.      <div class="div1 div">
  41.            <h1>hello</h1>
  42.            <h1>hello</h1>
  43.            <h1>hello</h1>
  44.            <h1>hello</h1>
  45.            <h1>hello</h1>
  46.            <h1>hello</h1>
  47.            <h1>hello</h1>
  48.            <h1>hello</h1>
  49.            <h1>hello</h1>
  50.            <h1>hello</h1>
  51.            <h1>hello</h1>
  52.            <h1>hello</h1>
  53.            <h1>hello</h1>
  54.            <h1>hello</h1>
  55.            <h1>hello</h1>
  56.            <h1>hello</h1>
  57.      </div>
  58.      <div class="div2 div"></div>
  59.      <div class="returnTop hide">返回顶部</div>
  60.  
  61.  <script src="jquery-3.1.1.js"></script>
  62.     <script>
  63.          $(window).scroll(function(){
  64.              var current=$(window).scrollTop();
  65.               console.log(current);
  66.               if (current>100){
  67.  
  68.                   $(".returnTop").removeClass("hide")
  69.               }
  70.               else {
  71.               $(".returnTop").addClass("hide")
  72.           }
  73.          });
  74.  
  75.             $(".returnTop").click(function(){
  76.                 $(window).scrollTop(0)
  77.             });
  78.  
  79.     </script>
  80. </body>
  81. </html>

尺寸操作

  1.         $("").height([val|fn])
  2.         $("").width([val|fn])
  3.         $("").innerHeight()
  4.         $("").innerWidth()
  5.         $("").outerHeight([soptions])
  6.         $("").outerWidth([options])

示例：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <style>
  7.         *{
  8.             margin: 0;
  9.         }
  10.         .box1{
  11.             width: 200px;
  12.             height: 200px;
  13.             background-color: wheat;
  14.             padding: 50px;
  15.             border: 50px solid rebeccapurple;
  16.             margin: 50px;
  17.         }
  18.  
  19.     </style>
  20. </head>
  21. <body>
  22.  
  23. <div class="box1">
  24.     DIVDIDVIDIV
  25. </div>
  26.  
  27. <p></p>
  28.  
  29. <script src="jquery-3.1.1.js"></script>
  30. <script>
  31.     var $height=$(".box1").height();
  32.     var $innerHeight=$(".box1").innerHeight();
  33.     var $outerHeight=$(".box1").outerHeight();
  34.     var $margin=$(".box1").outerHeight(true);
  35.  
  36.     $("p").text($height+"---"+$innerHeight+"-----"+$outerHeight+"-------"+$margin)
  37. </script>
  38. </body>
  39. </html>

扩展方法 (插件机制)

jQuery.extend(object)

扩展jQuery对象本身。

用来在jQuery命名空间上增加新函数。

在jQuery命名空间上增加两个函数:

  1. <script>
  2.     jQuery.extend({
  3.       min: function(a, b) { return a < b ? a : b; },
  4.       max: function(a, b) { return a > b ? a : b; }
  5. });
  6.  
  7.     jQuery.min(2,3); // => 2
  8.     jQuery.max(4,5); // => 5
  9. </script>

jQuery.fn.extend(object)

扩展 jQuery 元素集来提供新的方法（通常用来制作插件）

增加两个插件方法：

  1. <body>
  2.  
  3. <input type="checkbox">
  4. <input type="checkbox">
  5. <input type="checkbox">
  6.  
  7. <script src="jquery.min.js"></script>
  8. <script>
  9.     jQuery.fn.extend({
  10.       check: function() {
  11.          $(this).attr("checked",true);
  12.       },
  13.       uncheck: function() {
  14.          $(this).attr("checked",false);
  15.       }
  16.     });
  17.  
  18.     $(":checkbox:gt(0)").check()
  19. </script>
  20.  
  21. </body>

前端基础之:JQuery(可编辑版)的更多相关文章

  1. 进击的Python【第十六章】：Web前端基础之jQuery

    进击的Python[第十六章]:Web前端基础之jQuery 一.什么是 jQuery ? jQuery是一个JavaScript函数库. jQuery是一个轻量级的"写的少,做的多&quo ...

  2. 前端第四篇---前端基础之jQuery

    前端第四篇---前端基础之jQuery 一.jQuery介绍 二.jQuery对象 三.jQuery基础语法 四.事件 五.动画效果 六.补充each 一.jQuery简介 1.jQuery介绍 jQ ...

  3. Python学习（二十三）—— 前端基础之jQuery

    转载自http://www.cnblogs.com/liwenzhou/p/8178806.html 一.jQuery入门 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQue ...

  4. 前端基础 之 jQuery

    浏览目录 jQuery介绍 jQuery的优势 jQuery对象 jQuery内容 一.jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户 ...

  5. 前端基础之jQuery入门 01

    jQuery介绍 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交互, ...

  6. 前端基础之jQuery事件

    一.常用事件 click(function(){...}) hover(function(){...}) blur(function(){...}) focus(function(){...}) ch ...

  7. 四丶前端基础之jquery

    知识预览 一 jQuery是什么? 二 什么是jQuery对象? 三 寻找元素(选择器和筛选器) 四 操作元素(属性,css,文档处理) 扩展方法 (插件机制) 回到顶部 一 jQuery是什么? ［ ...

  8. 前端基础之jQuery

    JavaScript和jQuery的区别 JavaScript是一门编程语言,我们用它来编写客户端浏览器脚本 jQuery是javascript的一个库,包含多个可重用的函数,用来辅助我们简化java ...

  9. 前端基础之JQuery - day15

    写在前面 上课第15天,打卡: 张国臂掖,以通西域: ########### # 课上简书 # ########## http://jquery.cuishifeng.cn/index.html JQ ...

随机推荐

  1. Mac下忘记mysql的root密码

    cd /usr/local/mysql/bin sudo su sudo /usr/local/mysql/support-files/mysql.server stop # ./mysqld_saf ...

  2. [LOJ6198]谢特

    loj description 给你一个字符串和一个数组\(w_i\),定义\(\mbox{LCP}(i,j)\)为\(i,j\)两个后缀的最长公共前缀.求\(\max_{i,j}\mbox{LCP} ...

  3. CH3301 同余方程

    题意 3301 同余方程 0x30「数学知识」例题 描述 求关于 x的同余方程  ax ≡ 1(mod b) 的最小正整数解. 输入格式 输入只有一行,包含两个正整数a,b,用一个空格隔开. 输出格式 ...

  4. Linux配置Nginx＋Tomcat负载均衡

    cd /usr/local/tomcat1/webapps/ROOT/ tar -zxvf nginx-1.14.2.tar.gz -C /usr/local 一.Linux配置Nginx 一.下载N ...

  5. mark TODO：完善拦截规则；日志分析；web仪表盘展示；终极目标动态配置规则

  6. 02 - Unit02：登录功能

    需求实现步骤 发送Ajax请求 服务器处理 Ajax回调处理 登录功能 发送Ajax请求 绑定事件:"登录"按钮的单击事件 获取参数:用户名userName和密码password ...

  7. Python 迭代对象、迭代器、生成器

    原文出处: liuzhijun 本文源自RQ作者的一篇博文,原文是Iterables vs. Iterators vs. Generators,俺写的这篇文章是按照自己的理解做的参考翻译,算不上是原文 ...

  8. (转)2009-05-25 22:12 Outlook2007选择发送帐号

    本文转载自:http://hi.baidu.com/vugwggogodaenqe/item/c95c6d019457a2d873e676ec outlook2007可以用程序选择发送帐号,其他的版本 ...

  9. Python链表与反链表

    # -*- coding:utf8 -*- #/usr/bin/env python class Node(object): def __init__(self, data, pnext = None ...

  10. Ubuntu下VIM使用指南

    基本命令: Esc:VIM中的万能功能键之一,基本上任何时候按这个键,都可以返回VIM的普通状态. i:在普通状态下按i可以进入“插入”编辑状态,这个时候按方向键移动光标,在想要输入的地方输入字符,用 ...