Làm cách nào để chọn nhãn cho = xóa XYZ 'trong CSS?

HTML:

<label for="email">{t _your_email}:</label>

CSS:

label {
  display: block;
  width: 156px;
  cursor: pointer;
  padding-right: 6px;
  padding-bottom: 1px;
}

Tôi muốn chọn nhãn dựa trên thuộc tính 'for' để thực hiện thay đổi bố cục.

Bộ chọn sẽ là label[for=email]như vậy, trong CSS:

label[for=email]
{
    /* ...definitions here... */
}

... hoặc trong JavaScript bằng DOM:

var element = document.querySelector("label[for=email]");

... hoặc trong JavaScript bằng jQuery:

var element = $("label[for=email]");

Đó là một bộ chọn thuộc tính . Lưu ý rằng một số trình duyệt (ví dụ: phiên bản IE <8) có thể không hỗ trợ bộ chọn thuộc tính, nhưng những trình duyệt gần đây thì có. Để hỗ trợ các trình duyệt cũ hơn như IE6 và IE7, thật đáng buồn, bạn phải sử dụng một lớp (tốt, hoặc một số cách cấu trúc khác), thật đáng buồn.

(Tôi giả sử rằng mẫu {t _your_email}sẽ điền vào một trường id="email". Nếu không, hãy sử dụng một lớp thay thế.)

Lưu ý rằng nếu giá trị của thuộc tính bạn chọn không phù hợp với quy tắc cho mã định danh CSS (ví dụ: nếu có dấu cách hoặc dấu ngoặc trong đó hoặc bắt đầu bằng chữ số, v.v.), bạn cần có dấu ngoặc kép quanh giá trị:

label[for="field[]"]
{
    /* ...definitions here... */
}

Chúng có thể là dấu ngoặc đơn hoặc kép .

Nếu nội dung là một biến, sẽ cần phải nối nó với dấu ngoặc kép. Nó làm việc cho tôi. Như thế này:

mục Đã chọn (id: number) {
    console.log ('nhãn chứa', document.querySelector ("nhãn [for = '" + id + "']"));
}