使用jquery操作元素的css樣式(獲取、修改等等)
//1、獲取和設定樣式
$("#tow").attr("class")獲取ID為tow的class屬性
$("#two").attr("class","divClass")設定Id為two的class屬性。
//2、追加樣式
$("#two").addClass("divClass2")為ID為two的物件追加樣式divClass2
//3、移除樣式
$("#two").removeClass("divClass")移除 ID為two的物件的class名為divClass的樣式。
$(#two).removeClass("divClass divClass2")移除多個樣式。
//4、切換類名
$("#two").toggleClass("anotherClass") //重複切換anotherClass樣式
//5、判斷是否含有某項樣式
$("#two").hasClass("another")==$("#two").is(".another");
//6、獲取css樣式中的樣式
$("div").css("color") 設定color屬性值. $(element).css(style)
//設定單個樣式
$("div").css("color","red")
//設定多個樣式
$("div").css({fontSize:"30px",color:"red"})
$("div").css("height","30px")==$("div").height("30px")
$("div").css("width","30px")==$("div").height("30px")
//7.offset()方法
//它的作用是獲取元素在當前視窗的相對偏移,其中返回物件包含兩個屬性,即top和left 。
//注意:只對可見元素有效。
var offset=$("div").offset();
var left=offset.left; //獲取左偏移
var top=offset.top; //獲取右偏移
//8、position()方法
//它的作用是獲取元素相對於最近的一個position樣式屬性設定為relative或者absolute的祖父節點的相對偏移,與offset()一樣,它返回的物件也包括兩個屬性即top和left。
//9、scrollTop()方法和scrollLeft()方法
$("div").scrollTop(); //獲取元素的滾動條距頂端的距離。
$("div").scrollLeft(); //獲取元素的滾動條距左側的距離。
//10、jQuery中的 toggle和slideToggle 方法,都可以實現對一個元素的顯示和隱藏。區別是:
//toggle:動態效果為從右至左。橫向動作。
//slideToggle:動態效果從下至上。豎向動作。
//比如想實現一個樹由下至上收縮的動態效果,就使用slideToggle就ok了。
$('input').attr("readonly",true)//將input元素設定為readonly
$('input').attr("readonly",false)//去除input元素的readonly屬性
$('input').attr("disabled",true)//將input元素設定為disabled
$('input').attr("disabled",false)//去除input元素的disabled屬性
相關文章
- jQuery如何使用css方法修改單個樣式?jQueryCSS
- iframe的操作-Js/Jquery獲取iframe中的元素JSjQuery
- JS基礎_獲取元素的樣式JS
- jquery獲取元素節點jQuery
- jQuery 樣式操作jQuery
- jQuery知識總結之元素屬性與樣式的操作jQuery
- 前端與移動開發----jQuery----JQuery動畫,JQ操作元素屬性,JQ操作元素樣式(大量案例)前端移動開發jQuery動畫
- dom元素操作獲取等
- 使用 jQuery 選擇器獲取頁面元素,然後利用 jQuery 物件的 css() 方法設定其 display 樣式屬性,從而實現顯示和隱藏效果。jQuery物件CSS
- css修改title樣式CSS
- 【css】 如何修改select的樣式CSS
- 使用CSS定義頁面元素的外觀樣式CSS
- jQuery查詢帶有class樣式的元素jQuery
- CSS 獲取所有緊鄰兄弟元素CSS
- jQuery捕獲-獲取DOM元素內容和屬性jQuery
- [譯] 使用 closest() 函式獲取正確的 DOM 元素函式
- CSS 設定svg元素樣式CSSSVG
- jQuery 元素操作——遍歷元素jQuery
- Jquery如何獲取和設定元素內容?jQuery
- vue 前端框架的網頁是否是不能用 js 和 jquery 獲取元素屬性或修改?Vue前端框架網頁JSjQuery
- javascript 動態修改css樣式JavaScriptCSS
- 【CSS】VUE樣式修改不生效CSSVue
- CSS 第2個li元素樣式CSS
- CSS 第N個子元素樣式CSS
- jquery獲取低程式碼平臺iframe巢狀的父級元素指定元素jQuery巢狀
- 獲取或操作DOM元素特性的幾種方式
- 通過CSS變數修改樣式CSS變數
- (JavaScript學習記錄):jQuery 樣式操作JavaScriptjQuery
- CSS設定第n個li元素樣式CSS
- CSS 設定第n個li元素樣式CSS
- CSS 定義第二個li元素樣式CSS
- CSS 設定前n個li元素樣式CSS
- CSS 設定指定範圍li元素樣式CSS
- CSS 倒數第n個li元素樣式CSS
- css 獲取從第n個開始,之後的所有元素CSS
- jquery如何獲取第一個或最後一個子元素?jQuery
- 影片直播原始碼,CSS 修改捲軸樣式、信封邊框樣式原始碼CSS
- jQuery和CSS3打造GOOGLE樣式的使用者登入介面jQueryCSSS3Go
- Javascript 獲取 Dom 樣式的方法有哪些JavaScript