2. 程式人生 > >jquery技術詳解

jquery技術詳解

阿新 • • 發佈：2019-01-28

目錄(?)[+]

前面我們講解了的J2EE的技術都是服務端的技術，下面我們來看一下前端的一些開發技術，這一篇我們來看一下jQuery技術

簡介：

jQuery由美國人John Resig建立，至今已吸引了來自世界各地的眾多

javascript高手加入其team。
jQuery是繼prototype之後又一個優秀的Javascript框架。其宗旨是——WRITE LESS,DO MORE,寫更少的程式碼,做更多的事情。
它是輕量級的js庫(壓縮後只有21k) ，這是其它的js庫所不及的，它相容CSS3，還相容各種瀏覽器 （IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。
jQuery是一個快速的，簡潔的javaScript庫，使使用者能更方便地處理HTML documents、events、實現動畫效果，並且方便地為網站提供AJAX互動。
jQuery還有一個比較大的優勢是，它的文件說明很全，而且各種應用也說得很詳細，同時還有許多成熟的外掛可供選擇。

jQuery能夠使使用者的html頁保持程式碼和html內容分離，也就是說，不用再在html裡面插入一堆js來呼叫命令了，只需定義id即可。

工具：

我們在使用MyEclipse中編寫jQuery的時候，是沒有任何提示的，所以寫程式碼很難受的，我們需要藉助額外的工具Aptana，這個在編寫js，jQuery，Ajax等都會有相關的提示，具體如何在MyEclipse中新增這個工具，看如下的一篇文章：

jQuery的一個簡單例子：

  1. <!--引入jquery的js庫-->
  2.  <scripttype="text/javascript"src="script/jquery-1.4.2.js"
    ></script>
  3.  <scriptlanguage="JavaScript">
  4.    $(document).ready(function(){//等待dom元素載入完畢,類似window.onload;  
  5.        alert("您好,我是張三丰");  
  6.    });  
  7.  </script>
這裡要注意的是一定要記得引入jquery的js庫：jquery-1.4.2.js檔案

jQuery物件

jQuery 物件就是通過jQuery包裝DOM物件後產生的物件。
jQuery 物件是 jQuery 獨有的. 如果一個物件是 jQuery 物件, 那麼它就可以使用 jQuery 裡的方法: $(“#test”).html();
比如： 
$("#test").html() 

意思是指：獲取ID為test的元素內的html程式碼。其中html()是jQuery裡的方法 
這段程式碼等同於用DOM實現程式碼： 
document.getElementById(" test ").innerHTML; 
雖然jQuery物件是包裝DOM物件後產生的，但是jQuery無法使用DOM物件的任何方法，同理DOM物件也不能使用jQuery裡的方法.亂使用會報錯
約定：如果獲取的是 jQuery 物件, 那麼要在變數前面加上 $. 
var $variable = jQuery物件
var variable = DOM物件

DOM物件轉化成jQuery物件

對於已經是一個DOM物件，只需要用$()把DOM物件包裝起來，就可以獲得一個jQuery物件了。$(DOM物件) 


轉換後就可以使用 jQuery 中的方法了

jQuery物件轉化成DOM物件

兩種轉換方式將一個jQuery物件轉換成DOM物件：[index]和.get(index); 
(1) jQuery物件是一個數組物件，可以通過[index]的方法，來得到相應的DOM物件


(2) jQuery本身提供，通過.get(index)方法，得到相應的DOM物件    


jQuery選擇器

選擇器是 jQuery 的根基, 在 jQuery 中, 對事件處理, 遍歷 DOM 和 Ajax 操作都依賴於選擇器
jQuery 選擇器的優點:
簡潔的寫法                                                                                    
${“#id”}   等價於    document.getElementById("id");
${“tagName”}     等價於   document.getElementsByTagName("tagName");

完善的事件處理機制
val()獲得第一個匹配元素的當前值.

//若網頁中沒有id=value的元素,瀏覽器會報錯
document.getElementById("username").value;
   
//需要判斷document.getElementById("username")是否存在

  1. if(document.getElementById("username")){  
  2.   var username=document.getElementById("username");  
  3.   alert(username.value);  
  4. }else{  
  5.   alert("沒有該id元素");  
  6. }  

//使用JQUERY處理即使不存在也不會報錯
var $username=$("#username");
alert("^^^ "+$username.val());

//注意:在javaScript中函式返回值為空,表示false

基本選擇器：

基本選擇器是 jQuery 中最常用的選擇器, 也是最簡單的選擇器, 它通過元素 id, class 和標籤名來查詢 DOM 元素(在網頁中 id 只能使用一次, class 允許重複使用).
1、#id用法: $(”#myDiv”);    返回值  單個元素的組成的集合
說明: 這個就是直接選擇html中的id=”myDiv”
2、Element用法: $(”div”)     返回值  集合元素
說明: element的英文翻譯過來是”元素”,所以element其實就是html已經定義的標籤元素,例如 div, input, a 等等.
3、class 用法: $(”.myClass”)      返回值  集合元素
說明: 這個標籤是直接選擇html程式碼中class=”myClass”的元素或元素組(因為在同一html頁面中class是可以存在多個同樣值的).
4、*用法: $(”*”)      返回值  集合元素
說明: 匹配所有元素,多用於結合上下文來搜尋
5、selector1, selector2, selectorN      用法: $(”div,span,p.myClass”)    返回值  集合元素
說明: 將每一個選擇器匹配到的元素合併後一起返回.你可以指定任意多個選擇器, 並將匹配到的元素合併到一個結果內.其中p.myClass是表示匹配元素
p class=”myClass”

基本選擇器示例：

改變 id 為 one 的元素的背景色為 #0000FF
改變 class 為 mini 的所有元素的背景色為 #FF0033
改變元素名為 <div> 的所有元素的背景色為 #00FFFF
改變所有元素的背景色為 #00FF33
改變所有的<span>元素和 id 為 two 的元素的背景色為 #3399FF

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.   <head>
  4.     <title>base_selecter.html</title>
  5.     <metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
  6.     <metahttp-equiv="description"content="this is my page">
  7.     <metahttp-equiv="content-type"content="text/html; charset=UTF-8">
  8.     <scriptlanguage="JavaScript"src="../jquery/jquery-1.4.2.js"></script>
  9.     <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  10.   </head>
  11.   <body>
  12.     <inputvalue="haha"type="text"id="username"name="username"/>
  13.     <spanstyle="white-space:pre"></span><inputtype="button"value="改變id為one的元素的背景顏色"id="b1"/>
  14.     <inputtype="button"value="改變所有div的背景顏色"id="b2"/>
  15.     <inputtype="button"value="改變所有div背景顏色 為綠色"id="b3"/>
  16.     <inputtype="button"value="改變所有span和id為two的背景顏色 "id="b4"/>
  17.     <tableborder="1"cellspacing="0"width="200">
  18.         <tr>
  19.             <tdid="one"><ahref="#">1</a></td>
  20.             <tdclass="mini"><ahref="#">2</a></td>
  21.             <td>3</td>
  22.         </tr>
  23.     </table>
  24.     <ahref="#">嘿嘿</a>
  25.     <div>div1</div>
  26.     <divclass="mini"id="two">div2</div>
  27.     <div>div3</div>
  28.     <span>span1</span>
  29.     <span>span2</span>
  30.   </body>
  31.   <scriptlanguage="JavaScript">
  32.     //<inputvalue="haha"type="text"id="username"name="username"/>獲得焦點  
  33.     $("#username").focus(function(){  
  34.         alert("aaa");  
  35.     });  
  36.     //一、<inputtype="button"value="改變id為one的元素的背景顏色"name="ok"/>
  37.     $("#b1").click(function(){  
  38.         $("#one").css("background-color", "red");     
  39.     });  
  40.     //二、改變所有div背景顏色 為綠色  
  41.     $("#b2").click(function(){  
  42.         $("div").css("background-color", "green");  
  43.     });  
  44.     //三、改變class是mini的所有背景顏色為藍色  
  45.     $("#b3").click(function(){  
  46.         $(".mini").css("background-color", "blue");  
  47.     });  
  48.     //四、改變所有span和id為two的背景顏色  
  49.     $("#b4").click(function(){  
  50.         $("span,#two").css("background-color", "yellow");  
  51.     });  
  52.   </script>
  53. </html>

層次選擇器：

如果想通過 DOM 元素之間的層次關係來獲取特定元素, 例如後代元素, 子元素, 相鄰元素, 兄弟元素等, 則需要使用層次選擇器.
1 、ancestor descendant
用法: $(”form input”) ;   返回值  集合元素
說明: 在給定的祖先元素下匹配所有後代元素.這個要下面講的”parent > child”區分開.
2、parent > child 用法: $(”form > input”) ;    返回值  集合元素
說明: 在給定的父元素下匹配所有子元素.注意:要區分好後代元素與子元素
3、prev + next
用法: $(”label + input”) ;   返回值  集合元素
說明: 匹配所有緊接在 prev 元素後的 next 元素
4、prev ~ siblings
用法: $(”form ~ input”) ;    返回值  集合元素
說明: 匹配 prev 元素之後的所有 siblings 元素.注意:是匹配之後的元素,不包含該元素在內,並且siblings匹配的是和prev同輩的元素,其後輩元素不被匹配.
注意:  (“prev ~ div”) 選擇器只能選擇 “# prev ” 元素後面的同輩元素; 而 jQuery 中的方法 siblings() 與前後位置無關, 只要是同輩節點就可以選取

層次選擇器示例：

改變所有td中<a>標籤的字型
改變所有td中但不是td孫子以下的<a>標籤的顏色
改變id為one的下一個td背景色
改變id為two的所有div的背景色

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.   <head>
  4.     <title>base_selecter.html</title>
  5.     <metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
  6.     <metahttp-equiv="description"content="this is my page">
  7.     <metahttp-equiv="content-type"content="text/html; charset=UTF-8">
  8.     <scriptlanguage="JavaScript"src="../jquery/jquery-1.4.2.js"></script>
  9.     <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  10.   </head>
  11.   <body>
  12.     <inputtype="button"value="改變所有td中<a>標籤的字型"id="b1"/>
  13.     <inputtype="button"value="改變所有td中但不是td孫子以下的<a>標籤的顏色"id="b2"/>
  14.     <inputtype="button"value="改變id為one的下一個td背景色"id="b3"/>
  15.     <inputtype="button"value="改變id為two的所有div的背景色"id="b4"/>
  16.     <tableborder="1"cellspacing="0"width="200">
  17.         <tr>
  18.             <tdid="one"><ahref="#">1</a></td>
  19.             <tdclass="mini"><ahref="#">2</a><div><a>div中的</a></div></td>
  20.             <td>3</td>
  21.         </tr>
  22.     </table>
  23.     <ahref="#">嘿嘿</a>
  24.     <div>div1</div>
  25.     <divclass="mini"id="two">div2</div>
  26.     <div>div3</div>
  27.     <div>div4</div>
  28.     <span>span1</span>
  29.     <span>span2</span>
  30.   </body>
  31.   <scriptlanguage="JavaScript">
  32.   //層次選擇器  
  33.   // 一、   改變所有td中<a>標籤的字型  
  34.     $("#b1").click(function(){  
  35.         $("td a").css("background-color", "silver");  
  36.     });  
  37.     //二、 改變所有td中但不是td孫子以下的<a>標籤的字型  
  38.     $("#b2").click(function(){  
  39.         $("td>a").css("background-color", "silver");  
  40.     });  
  41.     //三、改變id為one的下一個td背景色  
  42.     $("#b3").click(function(){  
  43.         $("#one+td").css("background-color", "red");  
  44.     });  
  45.     //四、改變id為two的所有div的背景色  
  46.     $("#b4").click(function(){  
  47.         $("#two~div").css("background-color", "red");  
  48.     });  
  49.   </script>
  50. </html>

過濾選擇器：

過濾選擇器主要是通過特定的過濾規則來篩選出所需的 DOM 元素, 該選擇器都以 “:” 開頭
按照不同的過濾規則, 過濾選擇器可以分為基本過濾, 內容過濾, 可見性過濾, 屬性過濾, 子元素過濾和表單物件屬性過濾選擇器.

基礎過濾選擇器：

1、:first
用法: $(”tr:first”) ;  返回值  單個元素的組成的集合
      說明: 匹配找到的第一個元素
2、:last
用法: $(”tr:last”)  返回值  集合元素
      說明: 匹配找到的最後一個元素.與 :first 相對應.
3、:not(selector)
用法: $(”input:not(:checked)”)返回值  集合元素
     說明: 去除所有與給定選擇器匹配的元素.有點類似於”非”,意思是沒有被選中的input(當input的type=”checkbox”).
4、:even
用法: $(”tr:even”)  返回值  集合元素
     說明: 匹配所有索引值為偶數的元素，從 0 開始計數.js的陣列都是從0開始計數的.例如要選擇table中的行,因為是從0開始計數,所以table中的第一個tr就為偶數0.
5、: odd
用法: $(”tr:odd”) 返回值  集合元素
      說明: 匹配所有索引值為奇數的元素,和:even對應,從 0 開始計數.
 6、:eq(index) 用法: $(”tr:eq(0)”)    返回值  集合元素
      說明: 匹配一個給定索引值的元素.eq(0)就是獲取第一個tr元素.括號裡面的是索引值,不是元素排列數.
7、:gt(index) 用法: $(”tr:gt(0)”)    返回值  集合元素
說明: 匹配所有大於給定索引值的元素.
8、:lt(index) 用法: $(”tr:lt(2)”)    返回值  集合元素  
      說明: 匹配所有小於給定索引值的元素.
9、:header(固定寫法) 用法: $(”:header”).css(”background”, “#EEE”)    返回值  集合元素
      說明: 匹配如 h1, h2, h3之類的標題元素.這個是專門用來獲取h1,h2這樣的標題元素.
10、:animated(固定寫法)   返回值  集合元素
      說明: 匹配所有正在執行動畫效果的元素 
 基礎過濾選擇器示例： 改變第一個 div 元素的背景色為 #0000FF
改變最後一個 div 元素的背景色為 #0000FF
改變class不為 one 的所有 div 元素的背景色為 #0000FF
改變索引值為偶數的 div 元素的背景色為 #0000FF
改變索引值為奇數的 div 元素的背景色為 #0000FF
改變索引值為大於 3 的 div 元素的背景色為 #0000FF
改變索引值為等於 3 的 div 元素的背景色為 #0000FF
改變索引值為小於 3 的 div 元素的背景色為 #0000FF
改變所有的標題元素的背景色為 #0000FF
改變當前正在執行動畫的所有元素的背景色為 #0000FF
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.   <head>
  4.     <title>baseFilter_selecter.html</title>
  5.     <metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
  6.     <metahttp-equiv="description"content="this is my page">
  7.     <metahttp-equiv="content-type"content="text/html; charset=UTF-8">
  8.     <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  9.     <scriptlanguage="JavaScript"src="../jquery/jquery-1.4.2.js"></script>
  10.     <styletype="text/css">
  11.         #mover{  
  12.             width:100px;  
  13.             height:200px;  
  14.             background-color:red;  
  15.         }  
  16.     </style>
  17.   </head>
  18.   <body>
  19.     <inputtype="button"value="改變第一個div的背景色"id="b1"/>
  20.     <inputtype="button"value="改變最後一個div的背景色"id="b2"/>
  21.     <inputtype="button"value="改變class不為one的所有div的背景色"id="b3"/>
  22.     <inputtype="button"value="改變索引值為偶數的div的背景色"id="b4"/>
  23.     <inputtype="button"value="改變索引值為基數的div的背景色"id="b5"/>
  24.     <inputtype="button"value="改變索引值大於3的div的背景色"id="b6"/>
  25.     <inputtype="button"value="改變索引值等於3的div的背景色"id="b7"/>
  26.     <inputtype="button"value="改變索引值小於3的div的背景色"id="b8"/>
  27.     <inputtype="button"value="改變所有標題元素的背景色"id="b9"/>
  28.     <h2>h2</h2>
  29.     <h5>h5</h5>
  30.     <h3>h3</h3>
  31.     <divclass="one">div1</div>
  32.     <divclass="one">div2</div>
  33.     <div>div3</div>
  34.     <div>div4</div>
  35.     <div>div5</div>
  36.     <div>div6</div>
  37.     <div>div7</div>
  38.     <divclass="one">div8</div>
  39.     <div>div9</div>
  40.     <inputtype="button"value="增加動畫效果"id="b10"/><br>
  41.     <divid="mover">動畫</div>
  42.   </body>
  43.   <scriptlanguage="JavaScript">
  44.     //一、改變第一個div的背景色  
  45.     $("#b1").click(function(){  
  46.         $("div:first").css("background-color", "yellow");  
  47.     });  
  48.     //二、改變最後一個div的背景色  
  49.     $("#b2").click(function(){  
  50.         $("div:last").css("background-color", "red");  
  51.     });  
  52.     //三、改變class不為one的所有div的背景色  
  53.     $("#b3").click(function(){  
  54.         $("div:not(.one)").css("background-color", "yellow");  
  55.     });  
  56.     //四、改變索引值為偶數的div的背景色  
  57.     $("#b4").click(function(){  
  58.         $("div:even").css("background-color", "yellow");  
  59.     });  
  60.     //五、改變索引值為基數的div的背景色  
  61.     $("#b5").click(function(){  
  62.         $("div:odd").css("background-color", "yellow");  
  63.     });  
  64.     //六、改變索引值大於3的div的背景色  
  65.     $("#b6").click(function(){  
  66.         $("div:gt(3)").css("background-color", "yellow");  
  67.     });  
  68.     //七、改變索引值等於3的div的背景色  
  69.     $("#b7").click(function(){  
  70.         $("div:eq(3)").css("background-color", "yellow");  
  71.     });  
  72.     //八、改變索引值小於3的div的背景色  
  73.     $("#b8").click(function(){  
  74.         $("div:lt(3)").css("background-color", "yellow");  
  75.     });  
  76.     //九、改變所有標題元素的背景色  
  77.     $("#b9").click(function(){  
  78.         $(":header").css("background-color", "yellow");  
  79.     });  
  80.     //十、  <divid="mover">動畫</div>  增加動畫效果  
  81.     $("#b10").click(function(){  
  82.         $(":animated").css("background-color", "yellow");  
  83.     });  
  84.     function ca(){  
  85.         $("#mover").slideToggle(800, ca);  
  86.     }  
  87.     ca();  
  88.   </script>
  89. </html>

內容過濾選擇器：

內容過濾選擇器的過濾規則主要體現在它所包含的子元素和文字內容上
1、:contains(text) 用法: $(”div:contains(’John’)”)    返回值  集合元素
      說明: 匹配包含給定文字的元素.這個選擇器比較有用，當我們要選擇的不是dom標籤元素時,它就派上了用場了,它的作用是查詢被標籤”圍”起來的文字內容是否符合指定的內容的.
2、:empty 用法: $(”td:empty”)   返回值  集合元素
      說明: 匹配所有不包含子元素或者文字的空元素
3、:has(selector)
      用法: $(”div:has(p)”).addClass(”test”)    返回值  集合元素
      說明: 匹配含有選擇器所匹配的元素的元素.這個解釋需要好好琢磨,但是一旦看了使用的例子就完全清楚了:給所有包含p元素的div標籤加上class=”test”.
4、:parent 用法: $(”td:parent”)   返回值  集合元素
      說明: 匹配含有子元素或者文字的元素.注意:這裡是”:parent”,可不是”.parent”哦!感覺與上面講的”:empty”形成反義詞.
 內容過濾選擇器示例： 改變含有文字 ‘di’ 的 div 元素的背景色為 #0000FF
改變不包含子元素(或者文字元素) 的 div 空元素的背景色為 #0000FF
改變含有 class 為 mini 元素的 div 元素的背景色為 #0000FF
改變含有子元素(或者文字元素)的div元素的背景色為 #0000FF
改變不含有文字 di; 的 div 元素的背景色
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3.   <head>
  4.     <title>contentFilter_selecter.html</title>
  5.     <metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
  6.     <metahttp-equiv="description"content="this is my page">
  7.     <metahttp-equiv="content-type"content="text/html; charset=UTF-8">
  8.     <scriptlanguage="JavaScript"src="../jquery/jquery-1.4.2.js"></script>
  9.     <style>
  10.         .mini{  
  11.             width:100px;  
  12.             height:50px;  
  13.             background-color:green;  
  14.         }  
  15.     </style>
  16.   </head>
  17.   <body>
  18.     <inputtype="button"value="改變含有文字di的背景色"id="b1"/>
  19.     <inputtype="button"value="改變沒有文字的背景色"id="b2"/>
  20.     <inputtype="button"value="改變含有<p>的div元素的背景色"id="b3"/>
  21.     <inputtype="button"value="改變含有子元素或者文字的div"id="b4"/>
  22.     <inputtype="button"value="改變不含有文字di的div元素的背景色"id="b5"/>
  23.     <div> id為one div</div>
  24.     <div><p> id為two class是mini div</p></div>
  25.     <divclass="mini"></div>
  26.     <div> id為two class是mini</div>
  27.     <tableborder="1"cellspacing="0"width="200">
  28.         <tbody>
  29.             <tr>
  30.                 <td>1</td>
  31.                 <td>1</td>
  32.                 <td></td>
  33.                 <td></td>
  34.             </tr>
  35.         </tbody>
  36.     </table>
  37.   </body>
  38.   <scriptlanguage="JavaScript">
  39.     //一、改變含有文字di的背景色  
  40.     $("#b1").click(function(){  
  41.         $("div:contains('di')").css("background-color", "green");  
  42.     });  
  43.     //二、改變沒有文字的背景色  
  44.     $("#b2").click(function(){  
  45.         $("td:empty").css("background-color", 

相關推薦

jquery技術詳解

目錄(?)[+] 前面我們講解了的J2EE的技術都是服務端的技術，下面我們來看一下前端的一些開發技術，這一篇我們來看一下jQuery技術 簡介： jQuery由美國人John Resig建立，至今已吸引了來自世界各地的眾多 javascript高手

實現高性能糾刪碼引擎 | 糾刪碼技術詳解（下）

糾刪碼引擎 基礎知識 深入優化 技術 工程師 作者介紹： 徐祥曦，七牛雲工程師，獨立開發了多套高性能糾刪碼/再生碼編碼引擎。柳青，華中科技大學博士，研究方向為基於糾刪碼的分布式存儲系統。前言：在上篇《如何選擇糾刪碼編碼引擎》中，我們簡單了解了 Reed-Solomon Codes（RS 碼

Nginx技術詳解(2)

web服務器 nginx部署一個Web站點：服務器準備：node0IP：192.168.10.3進入/application/nginx/html/下把index.html文件刪除：rm -rf /application/nginx/html/index.html創建index.html文件，並追加文本：ec

Nginx技術詳解(1)

web服務器 nginxNginx Web服務應用：Nginx（engine x）是一個開源的，支持高並發的www服務和代理服務軟件。Nginx是俄羅斯人Igor Sysoev開發的，最初被應用到俄羅斯的大型網站（www.rambler.ru）上。後來作者將源代碼以類BSD許可證的形式開源出來供全球使用。在功

JSP/Servlet及相關技術詳解

script return 指令 o-c rip title info turn expires JSP聲明 <%!聲明部分%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio

C#漢字轉換拼音技術詳解（高性能）

rim none pie 存在 asp pub net 如果 pinyin public static class ChineseToPinYin { private static readonly Dictionary<<span class=

14.javaweb AJAX技術詳解

填充 cut pub cti div htm .get conn lec 一、簡介 1， ajax：在不重新加載網頁的前提下，與服務器交換數據並更新部分網頁的技巧，但其本身並不是一種新技術 2， 核心：XMLHttpRequest對象。AJAX技術主要是通過此

掃地機器人的構造及核心技術詳解

智能掃地機器人　　掃地機器人，又稱自動打掃機、智能吸塵、機器人吸塵器等，是智能家居電器的一種，能憑借一定的人工智能，自動在房間內完成地板清理工作。一般采用刷掃和真空方式，將地面雜物先吸納進入自身的垃圾收納盒，從而完成地面清理的功能。一般來說，將完成清掃、吸塵、擦地工作的機器人，也統一歸為掃地機器人。　　掃地機

CDN技術詳解(七)

事務 失敗 需求 重復數 ebsp 一個 解析 設置 不用 動態內容加速服務的實現 隨著Web2.0的興起，產生了動態網頁、個性化內容、電子交易數據等內容的加速，這些就涉及了動態內容加速技術。 靜態內容的加速，都是對於表現層的加速，對於動態頁面等內容的加速，則要涉及邏輯層

《Unity3D 實戰核心技術詳解》書中關於矩陣的錯誤

不同的 linear 應該 印刷 幫助 tar 線性代數 計算 計算機圖形學 最近一直在學習實時渲染，不免要接觸線性代數。而渲染中，一定會用到矩陣，當我再次去復習我之前看的書時，發現《Unity3D 實戰核心技術詳解》關於矩陣就有幾處錯誤 ，特標註出來。 書的第一章《3

HTTP協議報文、工作原理及Java中的HTTP通信技術詳解

tor 報文 buffered mod protoc 禁止 ans 請求報文 客戶端 博客園 首頁 新隨筆 聯系 管理 訂閱

ajax技術詳解，封裝一個原生的ajax請求

status 語法 match 基礎上 abort param sync 可選參數 導致 一、Ajax 概述 Ajax 是 Asynchronous Javascript And XML 的簡寫 Ajax是一門技術，並不是一門語言 使用XHTML+CSS來標準化呈現 使

jQuery動畫詳解

總結 當前 adding 什麽 設置 fas 永遠 hide 底層 本文最初發表於博客園，並在GitHub上持續更新前端的系列文章。歡迎在GitHub上關註我，一起入門和進階前端。 以下是正文。 前言 jQuery提供的一組網頁中常見的動畫效果，這些動畫是標準的、有

mysql主從復制技術詳解

mysql主從復制技術詳解M-S主服務器：master1第一步：打開bin-log日誌，設置如下：vim /etc/my.cnflog_binserver-id=1gtid_mode=ONenforce_gtid_consistency=1第二步：進入數據庫授權用戶mysql -uroot -p‘密碼‘gra

WEB網站滲透技術詳解

大拇指 一段 上傳 二次開發 們的 好好學習 提交 tar AR 有兩天沒發文章了，今天給大家來個大頭，那就是WEB網站滲透測試入侵教程 這個WEB網站滲透測試教程~是我見過的幾個少數的讓我看完就豎大拇指的教程 這部教程那可是我只能用棒棒的來形容說不出其他話來的 WEB網站

進階-中小型網絡構建-二層VLAN技術詳解配實驗步驟

中小型網絡構建進階-中小型網絡構建-二層VLAN技術詳解配實驗步驟為什麽講 VLAN ？ 在傳統的交換網絡中，為了隔離沖突域，我們引入了交換機。 交換機的每一個端口都是一個不同的隔離域。 但是交換機無法隔離廣播域， 所以，如果網絡中有一個惡意的主機發送廣播的惡意流量， 那麽處於同一個交換網路中的所有設備

ThinkPHP 緩存技術詳解 使用大S方法

sqlite 前臺 thum port class 比較 pac 周期性 百萬 如果沒有緩存的網站是百萬級或者千萬級的訪問量,會給數據庫或者服務器造成很大的壓力,通過緩存,大幅減少服務器和數據庫的負荷,假如我們把讀取數據的過程分為三個層,第一個是訪問層,第一個是緩存層

華為NAT技術詳解

服務器負載均衡 外部 網關 ott 通信 inb tab rul policy NAT介紹：NAT（Network Address Translation，網絡地址轉換）是1994年提出的。當在專用網內部的一些主機本來已經分配到了本地IP地址（即僅在本專用網內使用的專用地址

基於JDK的動態代理技術詳解

end course log 些許 private provide url 模仿 ade 雖然對於Spring的基本思想Aop是基於動態代理和CGlib這一點很早就有所認識,但是什麽是動態代理卻不甚清楚。為了對Spring加深理解,我覺得好好學習一下java

比特幣防篡改技術詳解

點的hash 區塊鏈 技術 mage 幣圈 大整數 挖礦 發放 做的 區塊鏈技術在當下的火爆程度不必多說，比特幣作為中本聰大神的“親兒子”，自然是研究區塊鏈技術繞不開的話題。比特幣是一個完全開放的去中心化的金融系統，時刻暴露在全球黑客攻擊之下仍能安全穩定的運行至今