Bagaimana untuk Mendapatkan URL Imej Latar Belakang daripada Elemen Div Menggunakan JavaScript?-tutorial css-php.cn

Bagaimana untuk Mendapatkan URL Imej Latar Belakang daripada Elemen Div Menggunakan JavaScript?

Patricia Arquette

Lepaskan： 2024-12-15 09:23:11

asal

383 orang telah melayarinya

How to Get a Background Image URL from a Div Element Using JavaScript?

Cara Mengekstrak URL Imej Latar Belakang Elemen Menggunakan JavaScript

Dalam JavaScript, adalah mungkin untuk mendapatkan semula URL imej latar belakang yang ditetapkan pada sesuatu unsur secara dinamik. Begini caranya:

S: Bagaimanakah saya boleh mendapatkan URL imej latar belakang bagi

elemen dalam JavaScript? Saya mempunyai elemen seperti ini:

Bagaimana cara saya mendapatkan semula URL imej latar belakang?

J: Untuk mendapatkan semula URL imej latar belakang, anda boleh gunakan kod berikut:

var img = document.getElementById('your_div_id');
var style = img.currentStyle || window.getComputedStyle(img, false);
var bi = style.backgroundImage.slice(4, -1).replace(/"/g, "");

Salin selepas log masuk

Jom pecahkan bawah:

Dapatkan id elemen dan gaya semasa atau gaya pengiraannya.
Akses sifat backgroundImage.
Potong rentetan untuk mengalih keluar "url(" dan aksara ")".
Gunakan ganti untuk menyingkirkan sebarang petikan berganda dalam URL.

Kini, bi akan mengandungi hanya URL imej latar belakang.

Contohnya:

// Get the URL from an element with id "testdiv"
var img = document.getElementById('testdiv');
var style = img.currentStyle || window.getComputedStyle(img, false);
var bi = style.backgroundImage.slice(4, -1).replace(/"/g, "");

// Display the URL
console.log('Image URL: ' + bi);

Salin selepas log masuk

Ini akan mengeluarkan URL latar belakang imej ke konsol.

Atas ialah kandungan terperinci Bagaimana untuk Mendapatkan URL Imej Latar Belakang daripada Elemen Div Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Bagaimanakah Saya Boleh Menukar Warna Peluru dalam Senarai HTML Menggunakan CSS Sahaja? Artikel seterusnya：Bagaimanakah Saya Boleh Melapisi Warna pada Imej Latar Belakang Hanya Menggunakan CSS?

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

Artikel terbaru oleh pengarang

Isu terkini

function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...

daripada 2024-04-29 11:01:01

2201

Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?

daripada 2024-04-23 00:22:19

2347

Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.

daripada 2024-04-19 15:37:47

1965

Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...