cari

Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Dapatkan Perisytiharan Kelas CSS sebagai Rentetan?

Bagaimanakah Saya Boleh Dapatkan Perisytiharan Kelas CSS sebagai Rentetan?

Susan Sarandon
Susan Sarandonasal
2024-12-11 11:30:12876semak imbas

How Can I Retrieve a CSS Class's Declaration as a String?

Cara Mengakses dan Membaca Nilai Peraturan CSS

Soalan:

Bagaimana saya boleh mendapatkan pengisytiharan CSS yang lengkap bagi kelas tertentu sebagai a rentetan?

Konteks:

Pertimbangkan HTML dan CSS berikut:

<html>
  <head>
    <style>
      .test {
        width: 80px;
        height: 50px;
        background-color: #808080;
      }
    </style>
  </head>
  <body>
    <div class="test"></div>
  </body>
</html>

Memandangkan CSS ini, saya ingin mengembalikan rentetan yang dipaparkan perwakilan gaya sebaris kelas .test, tanpa mengakses gaya individu secara langsung sifat.

Jawapan:

Untuk mendapatkan pengisytiharan CSS lengkap kelas tertentu:

function getStyle(className) {
  var cssText = "";

  // Get all CSS rules
  var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;

  // Iterate through rules
  for (var x = 0; x < classes.length; x++) {
    // If the class name matches the rule
    if (classes[x].selectorText == className) {
      // Capture the CSS declaration
      cssText += classes[x].cssText || classes[x].style.cssText;
    }
  }

  // Return the captured CSS declaration
  return cssText;
}

// Usage example:
var result = getStyle(".test");
console.log(result); // Output: "width: 80px; height: 50px; background-color: #808080;"

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Dapatkan Perisytiharan Kelas CSS sebagai Rentetan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

css html String class this Access
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Mengapakah Kaedah `peta` JavaScript Gagal pada Tatasusunan Dibuat dengan `Array(bilangan) baru`?Artikel seterusnya：Mengapakah Kaedah `peta` JavaScript Gagal pada Tatasusunan Dibuat dengan `Array(bilangan) baru`?

Artikel berkaitan

Lihat lagi