jQuery CSS 操作 - css() 方法

jQuery CSS Οδηγός Διαχείρισης Στυλ

Παράδειγμα

设置 <p> 元素的颜色：


  $("p\
});

Δοκιμάστε το προσωπικά

定义和用法

css() 方法返回或设置匹配的元素的一个或多个样式属性。

返回 CSS 属性值

返回第一个匹配元素的 CSS 属性值。

注释：当用于返回一个值时，不支持简写的 CSS 属性（比如 \"background\" 和 \"border\"）。

$(selector).css(name)
Παράμετροι Περιγραφή
name 必需。规定 CSS 属性的名称。该参数可包含任何 CSS 属性。比如 \"color\"。

Παράδειγμα

取得第一个段落的 color 样式属性的值：

$("p").css(\"color\");

Δοκιμάστε το προσωπικά

设置 CSS 属性

Ρυθμίστε την καθορισμένη CSS ιδιότητα όλων των ταιριζόμενων στοιχείων.

$(selector).css(name,value)
Παράμετροι Περιγραφή
name Απαιτείται. Ορίζει το όνομα του CSS ιδιοτητάς. Αυτός ο παράμετρος μπορεί να περιέχει οποιαδήποτε ιδιότητα CSS, όπως "color".
value

Προαιρετικό. Ορίζει την τιμή του CSS ιδιοτητάς. Αυτός ο παράμετρος μπορεί να περιέχει οποιαδήποτε τιμή ιδιοτητάς CSS, όπως "red".

Αν έχει ρυθμιστεί κενό字符串 τιμή, τότε αφαιρείται η καθορισμένη ιδιότητα από το στοιχείο.

Παράδειγμα

Ρυθμίστε το χρώμα όλων των παραγράφων σε κόκκινο:

$("p").css("color","red");

Δοκιμάστε το προσωπικά

Ρύθμιση CSS ιδιοτητάς με συνάρτηση

Ρυθμίστε την τιμή του στυλ για όλα τα ταιριζόμενα στοιχεία.

Αυτή η συνάρτηση επιστρέφει την τιμή που πρέπει να ρυθμιστεί. Αποδέχεται δύο παραμέτρους, index είναι η θέση του στοιχείου στην συλλογή, value είναι η αρχική τιμή του ιδιοτητάς.

$(selector).css(name,function(index,value))
Παράμετροι Περιγραφή
name Απαιτείται. Ορίζει το όνομα του CSS ιδιοτητάς. Αυτός ο παράμετρος μπορεί να περιέχει οποιαδήποτε ιδιότητα CSS, όπως "color".
function(index,value)

Ορίζει τη συνάρτηση που επιστρέφει την νέα τιμή του CSS ιδιοτητάς.

  • index - Προαιρετικό. Αποδέχεται την θέση του επιλογέα.
  • oldvalue - Προαιρετικό. Αποδέχεται την τρέχουσα τιμή του CSS ιδιοτητάς.

Παράδειγμα 1

Ρυθμίστε το χρώμα όλων των παραγράφων σε κόκκινο:

$("button").click(function(){
    $("p").css("color",function(){return "red";});
    });

Δοκιμάστε το προσωπικά

Παράδειγμα 2

Απανάλογα αυξήστε το πλάτος του div:

$("div").click(function() {
  $("this").css(
    "width", function(index, value) {return parseFloat(value) * 1.2;}
  );
});

Δοκιμάστε το προσωπικά

Ρύθμιση πολλαπλών CSS ιδιοτήτων/τιμών

$(selector).css({property:value, property:value, ...})

Ρυθμίστε τα στυλ των ταιριζόμενων στοιχείων με το αντικείμενο "όνομα/τιμή".

Αυτό είναι ο καλύτερος τρόπος για να ρυθμίσετε πολλά στυλ σε όλα τα ταιριζόμενα στοιχεία.

Παράμετροι Περιγραφή
{property:value}

Απαιτείται. Ορίζει το "όνομα/τιμή" του στυλ που πρέπει να ρυθμιστεί. Το αντικείμενο.

Αυτός ο παράμετρος μπορεί να περιέχει αρκετά ζευγάρια ονόματος/τιμής CSS. Π.χ. {"color":"red","font-weight":"bold"}

Παράδειγμα

$("p").css({
  "color":"white",
  "background-color":"#98bf21",
  "font-family":"Arial",
  "font-size":"20px",
  "padding":"5px"
  });

Δοκιμάστε το προσωπικά

jQuery CSS Οδηγός Διαχείρισης Στυλ