1. 程式人生 > >03-對JQuery對象的屬性,特性以及數據的操作

03-對JQuery對象的屬性,特性以及數據的操作

動態鏈接 中一 添加 func spa 發生 匹配 height 空格

  • 對JQuery對象的屬性,特性以及數據的操作:
    • 特性(attributes)和屬性(properties):
      • 特性的值是字符串。
      • 屬性的值不光為字符串,而且可以為布爾值,對象,數字。
      • 元素的屬性和特性有動態鏈接,如果特性在dom對象中存在,其中一個發生變化,另一個也會變化
      • 如果特性是本來就在dom對象中存在,但是類型為boolean,那麽特性和屬性將不會同步。
      • 如果attributes不是dom對象內建的屬性,attributes和properties的值不會同步。
    • 操作元素的特性:
      • 獲取特性的值:attr(name)
      • 設置特性的值:attr(name,value) attr(attributes)
      • 刪除特性:removeAttr(); 刪除多個特性中間加空格。
    • 操作元素的屬性:
      • 獲取屬性的值:prop(name)
      • 設置屬性的值:prop(name,value) prop(properties)
      • 特性不區分大小寫,屬性區分
      • 刪除屬性:removeProp();
    • 在元素中存儲數據:
      • 獲取數據的值:data([name])
      • 設置數據的值:data(name,value) data(object);
      • 刪除數據:removeData([name]);
      • 判斷元素是否這個數據:hasData(‘ele‘);
  • 修改JQuery對象的樣式和內容:
    • 添加或修改class:addClass(name);
    • 移除類:removeClass(name);
    • 以上方法可以定義函數,不過返回值需要有一個或多個類名。
$(#demo).addClass(function(index,className){
          return red;
     })

    • 判斷是否有某個類:hasClass(name);
    • 切換某個類,有就刪除,沒有就添加:toggleClass(name);
    • 獲取或設置style (用橫杠寫屬性需要加引號,駝峰則不用):css(name,value);
    • 設置不包含邊框和內邊距寬和高:width()和height();
    • 設置包含內邊距的高:innerHeight();
    • 設置包含內邊距和邊框的高,可以設置值為true的話包含外邊距:outerHeight();
    • 返回對象集合中的一個元素,返回兩個值,左側和頂部的距離:offset();
    • 返回匹配元素相對於父元素的位置(偏移):position();
    • 設置滾動條:scrollTop()和scrollLeft();
    • 設置內容:html()設置html的值,只獲取集合的的一個,text()設置文本,集合獲取全部值。

03-對JQuery對象的屬性,特性以及數據的操作