Saya menggunakan kode berikut untuk mengeksekusi beberapa pernyataan setelah beban halaman.
<script type="text/javascript">
window.onload = function () {
newInvite();
document.ag.src="b.jpg";
}
</script>
Tapi kode ini tidak bekerja dengan benar. Fungsi ini disebut bahkan jika beberapa gambar atau unsur-unsur yang memuat. Apa yang saya inginkan adalah untuk memanggil fungsi halaman dimuat sepenuhnya.
hal ini dapat bekerja untuk anda :
document.addEventListener('DOMContentLoaded', function() {
// your code here
}, false);
atau jika anda nyaman dengan jquery,
$(document).ready(function(){
// your code
});
$(document).siap()
kebakaran pada DOMContentLoaded, tapi acara ini tidak dipecat secara konsisten di antara browser. Ini adalah mengapa jQuery kemungkinan besar akan menerapkan beberapa berat workarounds untuk mendukung semua browser. Dan ini akan membuat sangat sulit untuk "persis" mensimulasikan perilaku menggunakan Javascript biasa (tapi tidak mustahil tentu saja).
sebagai Jeffrey Sweeney dan J Torres yang disarankan, saya pikir lebih baik untuk memiliki setTimeout
fungsi, sebelum menembak fungsi seperti di bawah ini :
setTimeout(function(){
//your code here
}, 3000);
A) dengan polos javascript:
document.addEventListener('readystatechange', event => {
if (event.target.readyState === "interactive") { //same as: ..addEventListener("DOMContentLoaded".. and jQuery.ready
alert("All HTML DOM elements are accessible");
}
if (event.target.readyState === "complete") {
alert("Now external resources are loaded too, like css,src etc... ");
}
});
B) dengan jQuery siap
:
$(function(){
alert("hello");
});
C) Don't menggunakan di bawah satu ( karena itu akan menimpa lain yang sama-jenis deklarasi ) :
document.onreadystatechange = function(){ alert("Hi"); }
Jika anda dapat menggunakan jQuery, lihat beban. Anda kemudian bisa mengatur fungsi untuk menjalankan setelah elemen anda selesai loading.
Sebagai contoh, pertimbangkan sebuah halaman dengan gambar yang sederhana:
<img src="book.png" alt="Book" id="book" />
Event handler dapat terikat ke gambar:
$('#book').load(function() {
// Handler for .load() called.
});
Jika anda membutuhkan semua elemen pada saat ini jendela untuk memuat, anda dapat menggunakan
$(window).load(function () {
// run code
});
I'm sedikit membingungkan bahwa apa yang anda maksudkan dengan memuat halaman selesai, "Beban DOM" atau "Content Beban" juga? Di halaman html beban dapat acara api setelah dua jenis acara.
img
kategori, sehingga acara ini memastikan bahwa semua img
dimuat tapi tidak ada gambar yang benar dimuat atau tidak. Untuk mendapatkan event ini kamu harus menulis cara berikut:dokumen.addEventListener('DOMContentLoaded', function() { // kode anda di sini }, false);
Atau menggunakan jQuery:
$(document).ready(function(){ // kode anda });
img
tag ini juga akan memastikan semua gambar atau lainnya relatif konten yang dimuat. Untuk mendapatkan event ini kamu harus menulis cara berikut:jendela.addEventListener('beban', function() {...})
Atau menggunakan jQuery:
$(window).pada('beban', function() { konsol.log('Semua aset yang dimuat') })
Jika anda ingin memanggil js fungsi pada halaman html anda menggunakan onload event. Onload event ini terjadi saat user agent selesai loading jendela atau semua frame dalam satu BINGKAI. Atribut ini dapat digunakan dengan TUBUH dan elemen FRAMESET.
<body onload="callFunction();">
....
</body>
Dengan cara ini anda dapat menangani kedua kasus - jika halaman sudah dimuat atau tidak:
document.onreadystatechange = function(){
if (document.readyState === "complete") {
myFunction();
}
else {
window.onload = function () {
myFunction();
};
};
}
Jika anda tidak menggunakan JS framework, proyek ini adalah cara terbaik untuk mendapatkan dom keadaan siap, dengan kompatibilitas cross browser
Saya dapat memberitahu anda bahwa jawaban terbaik yang saya temukan adalah untuk menempatkan "driver" script hanya setelah </body>
command. Ini adalah cara termudah dan, mungkin, lebih universal dari beberapa solusi, di atas.
Rencana: Pada halaman ini adalah tabel. Saya menulis halaman dengan tabel keluar ke browser, kemudian semacam itu dengan JS. Pengguna dapat resort dengan mengklik header kolom.
Setelah tabel ini berakhir </tbody>
command, dan tubuh ini berakhir, saya menggunakan kode berikut untuk memanggil penyortiran JS untuk mengurutkan tabel dengan kolom 3. Aku punya sorting script dari web sehingga tidak direproduksi di sini. Untuk setidaknya tahun depan, anda bisa melihat ini dalam operasi, termasuk JS, di static29.ILikeTheInternet.com
. Klik "di sini" di bagian bawah halaman. Yang akan memunculkan halaman lain dengan meja dan script. Anda dapat melihatnya memasang data kemudian dengan cepat semacam itu. Saya perlu untuk kecepatan itu sedikit tapi dasar-dasar yang ada sekarang.
</tbody></body><script type='text/javascript'>sortNum(3);</script></html>
MakerMikey
Anda're taruhan terbaik sejauh yang saya tahu adalah dengan menggunakan
jendela.addEventListener('beban', function() { konsol.log('Semua aset dimuat') });
DOMContentLoaded
kegiatan ini merupakan langkah mundur sejak DOM akan memuat sebelum semua aset beban.Jawaban yang lain merekomendasikan setTimeout
yang saya akan sangat menentang karena hal ini benar-benar subjektif klien's perangkat kinerja dan kecepatan koneksi jaringan. Jika seseorang adalah pada jaringan yang lambat dan/atau memiliki memperlambat cpu, halaman bisa mengambil beberapa puluhan detik untuk memuat, sehingga anda tidak bisa memprediksi berapa banyak waktu setTimeout
akan perlu.
Adapun readystatechange
, itu kebakaran setiap kali readyState
perubahan yang menurut MDN masih akan sebelum beban
acara.
Selesai
negara menunjukkan bahwa beban acara sekitar api.
panggil fungsi setelah menyelesaikan halaman memuat mengatur waktu keluar
setTimeout(function() {
var val = $('.GridStyle tr:nth-child(2) td:nth-child(4)').text();
for(var i, j = 0; i = ddl2.options[j]; j++) {
if(i.text == val) {
ddl2.selectedIndex = i.index;
break;
}
}
}, 1000);