Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Memilih Elemen mengikut Atribut Apabila querySelectorAll Hilang?

Bagaimana untuk Memilih Elemen mengikut Atribut Apabila querySelectorAll Hilang?

Patricia Arquette
Patricia Arquetteasal
2024-10-30 00:32:29113semak imbas

How to Select Elements by Attribute When querySelectorAll is Missing?

Cara Mendapatkan Elemen Mengikut Atribut Apabila querySelectorAll Tidak Tersedia

Walaupun kelazimannya, kaedah querySelectorAll mungkin tidak boleh diakses secara universal. Sebagai contoh, pelayar lama seperti IE7 kekurangan fungsi ini. Walau bagaimanapun, adalah mungkin untuk mencapai hasil yang serupa menggunakan pendekatan asli yang memastikan keserasian dengan IE7.

Pertimbangkan senario berikut:

<p data-foo="bar"></p>

Lazimnya, seseorang akan menggunakan querySelectorAll untuk mendapatkan semula elemen berdasarkan atribut mereka:

document.querySelectorAll('[data-foo]')

Walau bagaimanapun, jika tiada querySelectorAll, penyelesaian alternatif diperlukan.

Untuk mencapai kefungsian yang sama secara asli, fungsi JavaScript boleh dibina:

function getAllElementsWithAttribute(attribute) {
  var matchingElements = [];
  var allElements = document.getElementsByTagName('*');
  for (var i = 0, n = allElements.length; i < n; i++) {
    if (allElements[i].getAttribute(attribute) !== null) {
      matchingElements.push(allElements[i]);
    }
  }
  return matchingElements;
}

Fungsi ini merentasi keseluruhan dokumen, mendapatkan semula semua elemen dengan atribut tertentu. Dengan menggunakannya:

getAllElementsWithAttribute('data-foo');

seseorang boleh mendapatkan semula elemen dengan atribut "data-foo" dengan berkesan. Penyelesaian ini komprehensif dan serasi dengan IE7, membolehkan akses kepada elemen mengikut atribut walaupun dalam pelayar yang tidak mempunyai querySelectorAll.

Atas ialah kandungan terperinci Bagaimana untuk Memilih Elemen mengikut Atribut Apabila querySelectorAll Hilang?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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