jquery改變元素屬性值

技術小胖子發表於2017-11-07
jQuery
//標籤的屬性稱作元素屬性，在JS裡對應的DOM物件的對應屬性叫DOM屬性。JS裡的DOM屬性名有時和原元素屬性名不同。
//==================================操作元素屬性==================================
//返回元素指定屬性值
var txt1_val=$(“#txt1”).attr(“value”);
//通過元素的DOM屬性名更改DOM屬性值
$(“#txt1”).attr({ value : “txt1_value” , className : “txt1_class” });
//通過指定元素屬性改變元素屬性值
$(“#txt1”).attr(“class”,”txt1_class2″);
//給指定元素屬性賦值，通過後面捆綁的方法返回值
$(“#txt1”).attr(“class”,function(){
return “txt1_class3”;
})
//移除指定的元素屬性
$(“#txt1”).removeAttr(“class”);
//==================================修改CSS類==================================
//給CSS類即class元素屬性新增一個屬性值，可以新增多個之間用空格分開以下的對CSS類操作函式同樣可以填入多個CSS類
$(“#txt1”).addClass(“txt1_class txt1_class2”);
//判斷是否已有該CSS類，返回真假
$(“#txt1”).hasClass(“txt1_class txt1_class2”);
//移除指定CSS類，用空格分開，如無指定則刪除該元素所有CSS類
$(“#txt1”).removeClass(“txt1_class”);
//判斷是否有這個CSS類，有就刪除，沒有就新增
$(“#txt1”).toggleClass(“txt1_class”);
//根據後面的返回真則新增此CSS類，假則刪除此CSS類
$(“#txt1”).toggleClass(“txt1_class”,false);
//==================================修改CSS屬性==================================
//返回指定CSS樣式值
$(“#txt1”).css(“color”);
//一次賦多個樣式
$(“#txt1″).css({color:”#ff0011″,background:”blue”});
//一次賦一個指定的樣式
$(“#txt1”).css(“color”,”black”);
//==================================寬和高相關==================================
//設定元素的高度，無值則返回該元素的高度單位畫素
$(“#txt1”).height(25);
//設定元素的寬度，無值則返回該元素的寬度
$(“#txt1”).width(150);
//獲取元素的內部高度，不包括邊框
$(“#txt1”).innerHeight();
//獲取元素內部寬度，不包括變寬
$(“#txt1”).innerWidth();
//獲取元素外部高度，包括邊框
$(“#txt1”).outerHeight();
//獲取元素外部寬度，包括邊框
$(“#txt1”).outerWidth();
//==================================位置相關==================================
//獲取元素相對視窗的偏移位置，返回兩個值，一個top值，一個left值
var txt1_offset=$(“#txt1”).offset();
var top=txt1_offset.top;
var left=txt1_offset.left;
//返回相對父元素的相對偏移位置，返回兩個值一個top，一個left
var txt1_position=$(“#txt1”).position();
var top=txt1_position.top;
var left=txt1_position.left;
     本文轉自韓立偉 51CTO部落格，原文連結http://blog.51cto.com/hanchaohan/1214355：，如需轉載請自行聯絡原作者


相關文章