Rumah >hujung hadapan web >tutorial js >Bagaimana untuk menambah imej dalam JavaScript

Bagaimana untuk menambah imej dalam JavaScript

醉折花枝作酒筹
醉折花枝作酒筹asal
2021-07-22 11:41:2920368semak imbas

Jika anda ingin menggunakan JavaScript untuk menambah imej, anda boleh menggunakan kaedah createElement() untuk mencipta elemen img dan menetapkan nilai alamat URL imej kepada atribut src elemen img kemudian gunakan kaedah appendChild() untuk menambah elemen img kepada Hanya tentukan objek dom.

Bagaimana untuk menambah imej dalam JavaScript

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.

Jika anda ingin menggunakan JavaScript untuk menambah imej, anda boleh menggunakan kaedah createElement() untuk mencipta elemen img dan menetapkan nilai alamat URL imej kepada atribut src elemen img kemudian gunakan kaedah appendChild() untuk menambah elemen img kepada Hanya tentukan objek dom.

kaedah createElement()

kaedah createElement() mencipta elemen dengan menyatakan nama

Sintaks:

document.createElement(nodename)

Parameter :nodename: diperlukan. Buat nama elemen.

Nilai pulangan: Nod elemen yang dibuat

kaedah getElementById()

kaedah getElementById() boleh mengembalikan objek pertama dengan petikan ID yang ditentukan.

HTML DOM mentakrifkan berbilang kaedah untuk mencari elemen, sebagai tambahan kepada getElementById(), terdapat juga getElementsByName() dan getElementsByTagName().

Jika tiada elemen dengan ID yang ditentukan, kembalikan null

Jika terdapat berbilang elemen dengan ID yang ditentukan, kembalikan tanpa definisi.

Sintaks:

document.getElementById(elementID)

kaedah appendChild()

kaedah appendChild() menambah anak baharu pada penghujung senarai nod anak nod nod.

Petua: Jika newchild sudah wujud dalam pepohon dokumen, ia akan dialih keluar daripada pepohon dokumen dan dimasukkan semula dalam kedudukan baharunya. Jika newchild ialah nod DocumentFragment, ia tidak akan disisipkan secara langsung, tetapi nod anaknya akan dimasukkan mengikut urutan pada penghujung tatasusunan childNodes[] nod semasa.

Anda boleh menggunakan kaedah appendChild() untuk mengalih keluar elemen ke elemen lain.

Sintaks:

node.appendChild(node)

Parameter: nod: diperlukan. Objek nod yang anda mahu tambah.

Contoh: JavaScript untuk menambah imej pada elemen div

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script type="text/javascript">
			window.onload = function() {
				var bigImg = document.createElement("img"); //创建一个img元素

				bigImg.src = "logo.png"; //给img元素的src属性赋值
				//bigImg.width="320";  //320个像素 不用加px
				var myp = document.getElementById(&#39;myp&#39;); //获得dom对象
				myp.appendChild(bigImg); //为dom添加子元素img

			};
		</script>
	</head>
	<body>
		<div id="myp" style="border:1px solid #eee;width:320px;height:100px;"></div>
	</body>

</html>

[Pembelajaran yang disyorkan: tutorial lanjutan javascript]

Atas ialah kandungan terperinci Bagaimana untuk menambah imej dalam JavaScript. 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