Rumah > Artikel > hujung hadapan web > Kesilapan biasa yang perlu dielakkan semasa memuatkan fail secara serentak menggunakan tag skrip

Kesilapan biasa yang perlu dielakkan semasa memuatkan fail secara serentak menggunakan tag skrip

WBOYasal: 2024-07-20 12:44:471088semak imbas

Anda mungkin berfikir bahawa memuatkan skrip secara serentak akan menjadikan baris kod seterusnya dilaksanakan selepas skrip dimuat turun, bukan? Tetapi itu bukan maksud memuatkan segerak fail javascript. Kekeliruan timbul apabila anda membandingkan strategi async vs sync vs tangguh untuk memuatkan fail tertentu.

Lebih lanjut tentang memuatkan fail javascript dalam cara async vs sync vs defer pada penghujung siaran.

Di sini kita mula-mula bercakap tentang pelaksanaan kod w.r.t. Untuk melaksanakan baris kod selepas skrip berjaya dimuat turun, anda boleh menggunakan atribut onload pada teg skrip. Rujuk coretan kod di bawah:

<html>

<head>
    <title>Sync Script Tag</title>
</head>

<body>
    <h1>Load script sync.</h1>
</body>
<script>
    function  afterLoad() {        
        console.log('script loaded successfully.') // executes after script has loaded   
    }    
    function  sync_load()  {        
        console.log('sync_load...')         
        var  s  =  document.createElement('script');        
        s.type  =  'text/javascript';        
        s.async  =  false; // load synchronously       
        s.onload  =  afterLoad;        
        s.src  =  "https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js";        
        var  x  =  document.getElementsByTagName('script')[0];        
        x.parentNode.insertBefore(s,  x);            
    }    
    console.log('JS entry')     
    sync_load();    
    console.log('next tick') // this executes before after_load 
</script>

</html>

Output:

Common mistake to avoid while loading a file synchronously using script tag

Sekarang, kembali kepada strategi async vs sync vs defer, sila rujuk imej di bawah melalui stackoverflow:

Common mistake to avoid while loading a file synchronously using script tag

Dalam kes ini, perbezaan antara async vs sync akan dimainkan semasa menghurai fail HTML. Ingat itu!

Selamat mengekod ✨

Atas ialah kandungan terperinci Kesilapan biasa yang perlu dielakkan semasa memuatkan fail secara serentak menggunakan tag skrip. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

JavaScript html while using Attribute this

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 sebelumnya：Saya Perlukan BantuanArtikel seterusnya：Saya Perlukan Bantuan

Artikel berkaitan

Lihat lagi