jq 複習帖子 經常使用操做

 1絕對定位(abs)與相對定位(relative)
    區別是相對定位參照本身的位置進行移動(固然須要設置top left這些生效)而且原來的位置保留着 偏移後會把
其它的層遮罩住
    絕對定位就是的參照位置就不像相對那樣是本身了 至因而哪一個 就看它的上級或上上級有沒有定位了 也就是有沒有position:relative
或position:fixed 等吧 當要絕對定位的層設好要參照位置的層後 就能夠用top left這些來定位置了 若是它的上級或上上級都沒定位的話就
會根據body的位置來定位了 還有最後一點絕對定位是不佔位置的
   ctrl + shift  + delete 清除瀏覽器緩存
 2項目開發中提交表單有如下三種方法:
   第一種:用form自帶屬性action提交
   第二種:用jquery提交:$("#formid").submit();
   第三種:用ajax提交:
   但若是form表單中數據不少時,不可能一一列出,只須要用$('#yourformid').serialize()就能夠了javascript

1解決jquery和其餘庫的衝突  能夠將$(dom對象).ready(function(){ }) ready是入口函數 function是要執行的功能
jquery子選擇器和後代選擇器的區別:
    ①寫法不同:
後代選擇器的標識爲:空格    
    如:ul li{width:150px;} 【ul和li之間用空格隔開】
子選擇器的標識爲:>
    如:ul>li{width:150px;}【ul和li之間用>隔開】
②功能不同:
後代選擇器是選擇ul包圍的 因此元素中的全部li元素,包括子元素、孫元素、曾孫元素等等等。
子選擇器僅僅選擇ul包圍的 子元素中的 li元素,不包括孫元素、曾孫元素等等等。css

③兼容性不同:
後代選擇器是全部瀏覽器都兼容的均可使用。
子選擇器在IE六、IE七、IE8中則是不被支持的選擇器,各自bug!
1基本過濾選擇器:
   :first    寫法:$("p:first")第一個<p>元素
   :last       $("p:last")最後一個<p>元素
   :even     $("tr:even")全部偶數<tr>元素
   :odd     $("tr:odd")全部奇數<tr>元素
   :eq(index) $("ul li:eq(3)") 列表中的第四個元素(index從0開始)
   :gt(no) $("ul li:gt(3)") 列出index大於3的元素
   :lt(no)  $("ul li:lt(3)") 列出index小於3的元素
   :not(selector) $("input:not(:empty)") 全部不爲空的input元素html

2可見性過濾選擇器
  :hidden    $("p:hidden")   全部隱藏的<p>元素
  :visible   $("table:visible") 全部可見的表格
jquery操做網頁
  1顯示或隱藏網頁內容
   語法:$(selector).show(speed,callback);//顯示隱藏的函數
        $(selector).hide(speed,callback);//隱藏函數
        $(selector).toggle(speed,callback);//顯示與隱藏能自動切換 再也不是單一的切換顯示
              toggle()函數用於切換頁面元素的可見狀態
speed設置顯示的速度 slow,fast或毫秒
callback設置動做完成後所執行的函數
  實現燈幻式的淡入效果
    fadeOut()淡出  fadeIn()淡入
  頁面的滑動隱藏
    滑動隱藏效果經過'slideUp()'函數實現
    滑動顯示效果經過'slideDown()'函數實現
jQuery動畫animate方法
  語法:$(selector).animate({params},speed,callback);
     必須的params參數定義造成動畫的css屬性。
     可選的speed參數規定效果的時長 它能夠取如下值:"slow","last"或毫秒.
     可選的callback參數是動畫完成以後所執行的函數名稱.
jquery獲取html
   三個簡單實用的用於dom操做的jQuery方法:
      text()-設置或返回所選元素的文本內容
      html()-設置或返回所選元素的內容(包括html標記 也就是html代碼)
      val()-設置或返回表單字段的值
label標籤單獨使用沒有什麼意義  要結合着input標籤使用纔有意義
   等下設置一下jquery登陸前端驗證
獲取當前元素的索引值
  1 index()函數可獲取當前元素的索引值
      index()函數返回指定元素相對於其餘指定元素的index位置 這些元素可經過
jquery選擇器或dom元素來指定
插入節點元素
  1  append()函數 (將新建立的節點元素插入到某個文檔)
     語法:$(selector).append(content);
(content參數表示要插入的內容 可包含html標籤)
  2  appendTo()函數在被選元素的結尾(仍然在內部)插入指定內容
   語法:$(content).appendTo(selector);
 (selector參數表示把內容追加到哪一個元素上)
  3 prepend()函數(將新建立的節點元素插入某個文檔)
   語法:$(selector).prepend(content);
  4 prependTo()函數在被元素的結尾(仍然在內部)插入指定內容
   語法:$(content).prependTo(selector)
  5 after()函數在被選元素後插入指定的內容
   語法:$(selector).after(content)
  6 insertAfter()函數在被選元素以後插入HTML標記或已有的元素
   語法:$(content).insertAfter(selector)
  7 before()函數在被選元素以後插入html標記或者已有的元素
    語法:$(selector).before(content)
  8 insertBefore()函數在被選元素以前html標記或已有的元素
    語法:$(content).insertBefore(selector);
 複製節點元素
   clone()函數可完成節點元素複製功能
    $(this).clone(true).appendTo("ul")
   能夠往復制後的節點追加內容的添加
      例如經過點擊複製追加添加內容
替換節點元素
  replaceWith()函數用指定的HTML內容或元素替換被選元素
  $(selector).replaceWith(content)
刪除節點元素
  remove()函數移除被選元素 包括它全部的文本和子節點
  empty()函數從被選元素移除全部內容 包括它全部的文本和子節點
   $(selector).empty()//這樣寫就行
 擴展點:$(selector).remove()與var $li=$(selector).remove() 寫法上有什麼區別嗎?
   jquery屬性操做方法(DOM)
        addClass() 向匹配的元素指定的類名
        attr() 設置返回匹配元素的屬性和值//經過匿名函數 function(){}來進行指定參數設置值
        hasClass() 檢查匹配的元素是否擁有指定的類
        html() 設置或返回匹配的元素集合中的html內容
        removeAttr() 從全部匹配的元素中移除指定的屬性
        removeClass() 從全部匹配的元素中刪除所有或者指定的類
        toggleclass() 從匹配的元素中添加或刪除一個類
        val() 設置或返回匹配元素的值
   jquery css操做函數
       css()  設置或返回匹配元素的樣式屬性
       height() 設置或返回匹配元素的高度
       offset() 返回第一個匹配元素相對於文檔的位置
       offsetParent() 返回最近的定位祖先元素
       position() 返回第一個匹配元素相對於父元素的位置
       scrollLeft() 設置或返回匹配元素相對滾動條左側的偏移
       scrollTop() 設置或返回元素相對滾動條頂部的偏移
       width() 設置或返回匹配元素的寬度前端

parent().next():表示的是當前節點的父節點的下一個節點(下一個節點方的位置有什麼特色)
用jquery作一個表單驗證
   1保證用戶在表單輸入合法數據
   2減輕服務器的壓力
如何作表單驗證:
  1獲取相應表單標籤的value屬性  val()
  2判斷獲取到的值是否符合要求
  3驗證的時機(局部驗證 全局驗證)
什麼是正則表達式:
  正則表達式是一種文本模式 包括普通字符(例如 a到 z 之間的字母)和特殊
字符(稱爲 「元字符」)
2正則表達式的用途?
  測試字符串內的模式
  替換文本
  基於模式匹配從字符串中提取字符串
3聲明正則表達式的方式、
  直接使用雙斜槓定義 : var reg=/ ^表達式 $ /;
  new RegExp('表達式'):var reg=new RegExp("表達式");
正則表達式經常使用符號:
 ()  小括號裏面的內容是一個總體
 [ ]  匹配中括號的內容的任意一項
 ^ 匹配輸入字符串開始處的位置 但在中括號表達式中使用的狀況除外
  在那種狀況下它對字符集取反
 { } 標記限定符表達式的開始
  |  指出在兩個項之間進行選擇
  $  匹配輸入字符串結尾的位置
  *  零次或屢次匹配前面的字符或子表達式 0~n
  +  一次或屢次匹配前面的字符或子表達式 1~n
 \ 將下一個字符標記爲一個特殊字符 或一個原義字符 或一個向後引用 或一個
 八進制轉義符
 ? 匹配前面的子表達式零次或一次 0~1
 \d 匹配一個數字字符 [0~9]
 \w 匹配包括下劃線任何單詞字符 等價於 "[A-Z a-z 0-9]" 經常使用
 \W 匹配任何非單詞字符 等價於 "[^A-Z a-z 0-9]". 經常使用
 \n 匹配一個換行符 等價於\x0a和\cj
 \b 匹配一個單詞邊界
 \B 匹配非單詞邊界
空閒時間之餘 強化下正則表達式的應用java

1 什麼是Ajax?
  Ajax=異步javascript 和 xml ajax 是一種用於建立快速動態網頁的而技術
 
關於jquery與 ajax
  jquery提供多個與ajax有關的方法 經過jquery ajax 方法 你可以使用http get
http post從遠程服務器上請求文本 html xml 或json 同時你可以把這些外部數據
直接載入網頁被選元素中 若是沒有jquery ajax編程是有些難度的
jquery中的load方法的理解$(選擇器).load(url,data,callback)
url:你所要請求的地址
data:傳輸的數據
callback:加載完load函數以後所要執行的函數操做
2jquery ajax中的事件介紹:詳情查看jquery ajax API文檔
3在客戶端和服務器端進行請求-響應的經常使用方法:
  GET-從指定的資源請求數據:
   語法:$.get(URL,callback);
 $.get()的第一個參數是咱們但願請求的url 第二個參數是回調函數。
第一個回調參數存有被請求頁面的內容 第二個回調參數存有請求的狀態.
  POST-向指定的資源提交要處理的數據
  語法: $.post(URL,data,callback);
  $.post()的第一個參數是咱們但願請求的url 第二個參數存有請求的狀態(數據)
  第三個參數是回調函數.
  GET基本用於從服務器得到(取回)數據 GET方法可能返回緩存數據POST也可用於
 從服務器獲取數據 不過POST方法不會緩存數據 而且經常使用於連同請求一塊兒發送數據
 4ajax建立XMLHttpRequest對象
  1 XMLHttpRequest是Ajax的基礎
  2 XMLHttpRequest用於在後臺與服務器交換數據
  3 建立XMLHttpRequest對象的語法:
     variable=new XMLHttpRequest();
爲了應對如今的一些新瀏覽器 要檢查瀏覽器是否支持XMLHttpRequest
若是不支持就建立ActiveXObject.代碼以下:
  var xmlhttp;
  if(window.XMLHttpRequest)
   {//code for IE7+ Firefox,Chrome,Opera,Safari
    xmlhttp=new XMLHttpRequest();
   }else
   {//code for IE6,IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

原文:https://blog.csdn.net/tyhgfgh/article/details/53366752

jquery

相關文章
相關標籤/搜索