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

Dapatkan URL Imej Latar Belakang Elemen Menggunakan JavaScript

Soalan: Bagaimanakah anda boleh mendapatkan semula URL latar belakang imej yang diberikan kepada

elemen menggunakan JavaScript? Sebagai contoh, diberikan kod HTML berikut:

<div>
<p>Bagaimanakah anda mengekstrak hanya URL imej latar belakang?</p>
<p><strong>Jawapan:</strong> Untuk mencapai ini, ikuti ini langkah:</p>
<ol><li>
<strong>Kenalpasti Elemen:</strong> Dapatkan rujukan kepada <div> elemen dengan ID uniknya menggunakan document.getElementById('id_div_anda').<li>
<strong>Dapatkan Gaya Dikira:</strong> Gunakan sifat currentStyle atau window.getComputedStyle() untuk mendapatkan penggayaan pengiraan bagi yang dikenal pasti elemen.</li>
<li>
<strong>Ekstrak Imej Latar Belakang URL:</strong> Akses sifat backgroundImage daripada gaya yang dikira. URL biasanya disertakan dalam kurungan, jadi slice(4, -1) digunakan untuk mengalih keluar aksara yang tidak diingini. Selain itu, sebarang petikan berganda dalam URL digantikan menggunakan replace(/"/g, "").</li>
<p>Coretan kod berikut menggambarkan pendekatan ini:</p>
<pre class="brush:php;toolbar:false">var img = document.getElementById('your_div_id'),
    style = img.currentStyle || window.getComputedStyle(img, false),
    bi = style.backgroundImage.slice(4, -1).replace(/"/g, "");

Dengan menggunakan kaedah ini, anda boleh mendapatkan semula dan menggunakan URL yang dikaitkan dengan imej latar belakang elemen tertentu dalam JavaScript dengan berkesan.