Mengapa Saya Tidak Dapat Menyuntik CSS ke Halaman Web Menggunakan Skrip Kandungan untuk Sambungan?

DDD
Lepaskan: 2024-11-11 05:02:03
asal
611 orang telah melayarinya

Why Am I Unable to Inject CSS into Webpages Using Content Scripts for Extensions?

Isu Suntikan CSS dalam Skrip Kandungan untuk Sambungan

Walaupun mentakrifkan suntikan CSS dalam manifes, fail CSS anda tetap tiada dalam halaman web. Berikut ialah punca dan penyelesaian yang mungkin:

Sebab: Peraturan CSS yang bercanggah

Helaian gaya disuntik tetapi tidak digunakan kerana gaya lain mengatasinya peraturan.

Penyelesaian:

  • Tingkatkan Kekhususan CSS: Tambahkan lebih banyak pemilih khusus pada peraturan CSS anda.
  • Gunakan "!important": Akhiran setiap peraturan dengan "!important" untuk menggantikan yang sedia ada gaya.

Sebab: Had Suntikan Skrip Kandungan

Versi Manifes 3 mengehadkan skrip kandungan daripada menyuntik CSS secara terus.

Penyelesaian : Suntikan CSS melalui skrip kandungan sebagai berikut:

myScript.js:

var style = document.createElement('link');
style.rel = 'stylesheet';
style.type = 'text/css';
style.href = chrome.extension.getURL('myStyles.css');
(document.head||document.documentElement).appendChild(style);
Salin selepas log masuk

manifest.json:

"web_accessible_resources": ["myStyles.css"]
Salin selepas log masuk

Nota : Apabila menggunakan Manifest versi 2, kekunci "web_accessible_resources" diperlukan untuk membenarkan akses kepada fail CSS daripada halaman bukan sambungan.

Atas ialah kandungan terperinci Mengapa Saya Tidak Dapat Menyuntik CSS ke Halaman Web Menggunakan Skrip Kandungan untuk Sambungan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan