Terdapat beberapa cara untuk menulis fungsi sedia jquery-Soal Jawab bahagian hadapan-php.cn

Rumah

hujung hadapan web

Soal Jawab bahagian hadapan

Terdapat beberapa cara untuk menulis fungsi sedia jquery

青灯夜游

Nov 25, 2022 pm 08:38 PM

javascriptjquery

Terdapat tiga cara untuk menulis fungsi sedia jquery: 1. Cara lengkap menulis "$(document).ready(function(){//ready code});"; meninggalkan dokumen "$(). ready(function(){//ready code});"; 3. Kaedah menulis "$(function(){//ready code});" ditinggalkan.

Terdapat beberapa cara untuk menulis fungsi sedia jquery

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 3.6.1, komputer Dell G3.

fungsi sedia dokumen jquery

Kadangkala, dalam halaman Html, kita perlu menunggu sehingga semua kandungan Html halaman dimuatkan sebelum melaksanakan Kod JS, pada masa ini, jQuery menyediakan fungsi bernama Document Ready, yang boleh menyelesaikan masalah ini dengan mudah.

Contohnya:

<script type="text/javascript">
$(document).ready(function () {
//文档就绪后直接运行的JS代码
});
</script>

$: jquery flag
onload: Muatkan semua kandungan dalam halaman, termasuk sumber luaran (gambar, dokumen, dsb. fail)

Mula-mula muatkan semua kandungan dan sumber luaran pada halaman, dan kemudian muatkan kod js
sedia ( fungsi sedia dokumen): memuatkan Kandungan dalam halaman tidak termasuk sumber luaran ()

Mula-mula muatkan semua kandungan teg dalam halaman, kemudian muatkan kod js, dan akhirnya muatkan sumber luaran

Kod kes berikut:

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title></title>
		<script src="js/jquery-3.6.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(
				function() { //文档就绪后直接运行的代码
					function f1() {
						var div1 = document.getElementById("div1");
						div1.innerText = "Hello";
					}
					f1();
				});
		</script>
	</head>
	<body>
		<div id="div1"></div>
	</body>
</html>

Gunakan kaedah ready() jQuery untuk menjalankan kod dalam dokumen HTML selepas ia dimuatkan sepenuhnya, yang menghalang pencarian unsur-unsur yang tidak wujud.

Terdapat beberapa cara untuk menulis fungsi sedia jquery

Dalam jQuery, $(document).ready(function () {}) boleh diketepikan sebagai:

$().ready(function(){})
$(function(){});

Dari segi saiz kod, jenis kedua adalah kurang dan patut disyorkan .

Berdasarkan penggunaan kod jQuery di atas, jQuery menjadikan kod JS lebih mudah dan memerlukan lebih sedikit kod, menjadikan kod JS secara keseluruhan lebih mudah untuk dibangunkan dan diselenggara.

Ringkasan: Terdapat tiga kaedah fungsi sedia dokumen

Format penulisan pertama fungsi sedia dokumen

$(document).ready(function(){
alert("文档就绪函数第一种书写方法");
})

Dokumen Cara kedua untuk menulis fungsi sedia

$().ready(function(){
alert("文档就绪函数第二种书写方法");
})

Cara ketiga untuk menulis fungsi sedia dokumen

$(function(){
alert("文档就绪函数第三种书写方法");
})

[Pembelajaran yang disyorkan: tutorial video jQuery , video bahagian hadapan web】

Atas ialah kandungan terperinci Terdapat beberapa cara untuk menulis fungsi sedia jquery. 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

Artikel Berkaitan

Apakah batasan React?May 02, 2025 am 12:26 AM

React'slimitationscincu: 1) asteeplearningcurveduetoitsvastecosystem, 2) seochallengeswithclient-siderendering, 3) potensiperformanceisseSsueSinlarGeapplications, 4) complexstatemanagementasappsgrow, dan5) theneedtokeepupwithitshiteVolution.terichePupePher.

Kurva Pembelajaran React: Cabaran untuk pemaju baruMay 02, 2025 am 12:24 AM

ReactischallengingforbeginnersduetoitssteeplearningcurveandParadigmshifttocomponent-rasedarchitecture.1) permulaan

Menjana kekunci yang stabil dan unik untuk senarai dinamik dalam ReactMay 02, 2025 am 12:22 AM

ThecorechallengeingeneratingsTableAnduniqueysfordynamicListSinreactisensuringingconsistententidentifiersacrossre-renderforefficientdomupdates.1) usenaturalkeyshenpossible, astheyarereliafuniqueandstable.2) GeneratesYntheticeSbaseSbasedonMultonmultRase

Keletihan JavaScript: Tinggal semasa dengan React dan alatnyaMay 02, 2025 am 12:19 AM

JavaScriptfatigueinReactismanageablewithstrategieslikejust-in-timelearningandcuratedinformationsources.1)Learnwhatyouneedwhenyouneedit,focusingonprojectrelevance.2)FollowkeyblogsliketheofficialReactblogandengagewithcommunitieslikeReactifluxonDiscordt

Komponen Ujian yang Menggunakan Cangkuk UseState ()May 02, 2025 am 12:13 AM

TotestreactcomponentsusingtheusestateHook, usejestandreacttestinglibrarytosimulateIntionsIntionsandverifyStateChangesIntheui.1)

Kekunci dalam React: menyelam mendalam ke dalam teknik pengoptimuman prestasiMay 01, 2025 am 12:25 AM

KeysinreactarecrucialForOptimizingPerformanceAdingInefficientListupdates.1) UsEkeyStoIdentifyandTrackListelements.2) EvoleUsingArtArrayindicesSeyStoPreventProventProveSsues.3) pemilihan yang boleh dikenali

Apakah kunci dalam React?May 01, 2025 am 12:25 AM

Reactkeysareuniqueidiersededwhenrenderingliststoimprovereconciliationeficiency.1) theHelpreacttrackChangesinListItems, 2) menggunakanStableAnduniquiDiersLikeitemidsisismended, 3) mengelakkanAringArtArayindicesSeyStopreVentisswithreordering, dan.

Kepentingan kunci unik dalam React: Mengelakkan perangkap biasaMay 01, 2025 am 12:19 AM

UnikKeysarecrucialinreactoroptimizingRenderingAndMaintainingComponentStateIntrity.1) useanaturalUniquierifierifierFromyourdataifavailable.2) ifnonaturalalidentifierexists, generateauniquekeyusingalibraryLikeuUid.3)

See all articles