Yanıtlar:
window.onload = myOnloadFunc
ve aynı etkinliği<body onload="myOnloadFunc();">
kullanmanın farklı yollarıdır . Kullanmak daha az rahatsız edici - JavaScript'inizi HTML'den çıkarır.window.onload
Tüm yaygın JavaScript kitaplıkları, Prototip, ExtJS, Dojo, JQuery, YUI, vb. Belge yüklendikçe meydana gelen olayların etrafında güzel sarmalayıcılar sağlar. OnLoad olayını dinleyebilir ve buna tepki verebilirsiniz, ancak onLoad tüm kaynaklar indirilene kadar tetiklenmez, bu nedenle olay işleyiciniz son büyük görüntü alınana kadar yürütülmez. Bazı durumlarda tam olarak istediğiniz budur, bazılarında DOM hazır olduğunda dinlemenin daha uygun olduğunu görebilirsiniz - bu olay onLoad'a benzer, ancak resim beklemeden vb.
myOnloadFunc()
genel bağlamda çağrılacaktır ( this
atıfta bulunulacaktır window
). Javascript ile ayarlanması, öğenin bağlamında yürütülmesini sağlayacaktır ( this
olayın tetiklendiği öğeye atıfta bulunur). Bu özel durumda, bir fark yaratmaz, ancak diğer unsurlarla birlikte olur.
this
istenirse atıfta bulunulan nesneyi geçersiz kılabilirsiniz .
Fark yok, ama ikisini de kullanmamalısın.
Birçok tarayıcıda, window.onload
tüm resimler yüklenene kadar olay tetiklenmez; bu, istediğiniz şey değildir. Standart tabanlı tarayıcıların daha DOMContentLoaded
önce tetiklenen bir olayı vardır, ancak IE tarafından desteklenmez (bu yanıtı yazarken). Bir çapraz tarayıcı DOMContentLoaded özelliğini destekleyen bir javascript kütüphanesi kullanmanızı veya kullanabileceğiniz iyi yazılmış bir işlev bulmanızı öneririm. jQuery's $(document).ready()
, iyi bir örnektir.
window.onload
vücut olmadan çalışabilir. Yalnızca komut dosyası etiketleriyle sayfa oluşturun ve bir tarayıcıda açın. Sayfa herhangi bir gövde içermiyor, ancak hala çalışıyor ..
<script>
function testSp()
{
alert("hit");
}
window.onload=testSp;
</script>
<!ELEMENT html (head, body)>
[1] - ve html401 belirtir <!ELEMENT HTML O O (%html.content;)
ile <!ENTITY % html.content "HEAD, BODY">
de [2]. html51 A head element followed by a body element.
, html içeriği için de geçerlidir. [3] w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Strict w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Strict w3.org/TR/html51/semantics.html#the -html-element - Sanırım tüm bu yaygın / kullanılan HTML standartlarının bir gövde etiketi gerektirdiğini düşünüyorum . :)
Start tag: optional, End tag: optional
Ben, genel olarak tercih değil kullanın <body onload=""
> Etkinliği. Davranışı mümkün olduğunca içerikten ayırmanın daha temiz olduğunu düşünüyorum.
Bununla birlikte, vücut yükü kullanmanın hafif bir hız artışı sağlayabileceği durumlar vardır (genellikle benim için oldukça nadirdir).
Ben genellikle <head
benim sayfamın> içine böyle bir şey koymak Prototip kullanmak istiyorum :
document.observe("dom:loaded", function(){
alert('The DOM is loaded!');
});
veya
Event.observe(window, 'load', function(){
alert('Window onload');
});
Yukarıdakiler burada öğrendiğim hileler . HTML dışındaki olay işleyicileri ekleme kavramına çok düşkündüm.
(Koddaki yazım hatasını düzeltmek için düzenleyin.)
Nesnel bir soruya çok fazla öznel cevap. "Göze batmayan" JavaScript, asla goto kullanmamak için eski kural gibi batıl inançtır. Kodu, birinin modaya uygun dini inançlarına göre değil, hedefinize güvenilir bir şekilde ulaşmanıza yardımcı olacak bir şekilde yazın.
Bulan herkes:
<body onload="body_onload();">
aşırı dikkat dağıtıcı olmak aşırı iddialıdır ve öncelikleri düz değildir.
Normalde JavaScript kodumu ayrı bir .js dosyasına koydum, ancak bu arada geçerli HTML olan olay işleyicilerini HTML'de takma konusunda hantal bir şey bulamıyorum.
window.onload
- Tüm DOM, JS dosyaları, Görüntüler, Iframe'ler, Uzantılar ve diğerleri tamamen yüklendikten sonra çağrılır. Bu, $ (window) .load (function () {});
body onload=""
- DOM yüklendikten sonra çağrılır. Bu, $ (document) .ready (function () {});
ready
karşı en büyük yanılgılar arasında sayılmaktadır onload
. load
tüm komut dosyaları, resimler ve stil sayfaları dahil olmak üzere tüm belge yüklendikten sonra patlar. DOMContentLoaded
inşa edilmiştir DOM ağacının sonra ancak resimlerin vb Onun öncesinde yangınlar DOMContentLoaded
denklik vardır document.ready
, değil load
.
Yükü diğer özellikler gibi düşünün. Örneğin, bir giriş kutusuna şunları koyabilirsiniz:
<input id="test1" value="something"/>
Veya şunları arayabilirsiniz:
document.getElementById('test1').value = "somethingelse";
Onload özniteliği, value özniteliğinde olduğu gibi bir dize yerine değeri olarak bir işlev alması dışında aynı şekilde çalışır. Bu ayrıca neden "bunlardan sadece birini kullanabileceğinizi" açıklar - window.onload çağrısı, gövde etiketi için onload özniteliğinin değerini yeniden atar.
Ayrıca, buradaki diğerlerinin söylediği gibi, genellikle stil ve javascript'i sayfanın içeriğinden ayrı tutmak daha temizdir, bu yüzden çoğu insan window.onload veya jQuery'nin hazır işlevini kullanmanızı önerir.
<body onload = ""> window.onload öğesini geçersiz kılmalıdır.
<Body onload = ""> ile document.body.onload, tarayıcıya bağlı olarak null, undefined veya bir işlev olabilir (ancak anonim işlevin gövdesini dize olarak almak için getAttribute ("onload") biraz tutarlı olmalıdır) . Window.onload ile, ona bir işlev atadığınızda, window.onload tarayıcılarda sürekli bir işlev olacaktır. Bu sizin için önemliyse window.onload komutunu kullanın.
window.onload, JS'yi içeriğinizden yine de ayırmak için daha iyidir. Window.onload'u kullanabildiğinizde <body onload = ""> kullanmanın pek bir nedeni yoktur.
Opera'da, window.onload ve <body onload = ""> (ve hatta window.addEventListener ("load", func, false)) için olay hedefi, Safari ve Firefox'ta olduğu gibi belge yerine pencere olacaktır. Ancak, 'bu' tarayıcılardaki pencere olacaktır.
Bunun anlamı, önemli olduğunda, kabuğunu sarmalı ve işleri tutarlı hale getirmeli veya sizin için yapan bir kütüphane kullanmalısınız.
İkisi de aynı şekilde çalışıyor. Ancak, her ikisi de tanımlanırsa, bunlardan sadece birinin çağrıldığını unutmayın. Genellikle ikisini de doğrudan kullanmaktan kaçınırım. Bunun yerine, load olayına bir olay işleyicisi ekleyebilirsiniz. Bu şekilde, onload olayına geri çağrı eklemesi gerekebilecek diğer JS paketlerini daha kolay bir şekilde dahil edebilirsiniz.
Tüm JS çerçevelerinde olay işleyicileri için tarayıcılar arası yöntemler bulunur.
İçerik, düzen ve davranışın ayrı olması kabul edilen bir standarttır. Yani window.onload () kullanımı her <body onload="">
ikisinin de aynı işi yapmasına rağmen daha uygun olacaktır .
Maalesef uyku başka 3 yıl sonra tekrar bu dişin reenkarnasyon için, ama belki de nihayet tartışılmaz yarar bulduk window.onload=fn1;
üzerinde <body onload="fn1()">
. Bu ilgilendiren JS modüllerini veya ES modülleri senin zaman: onload
"klasik" JS dosyasına işleyicisi bulunduğu (yani olmadan sevk <script type="module" … >
, her iki şekilde mümkündür; senin zaman onload
JS dosyasına "modülündeki" işleyicisi bulunduğu (yani birlikte anılan <script type="module" … >
, <body onload="fn1()">
fn1" başarısız olur () tanımlanmadı "hatası. Bunun nedeni, HTML ayrıştırılmadan önce ES modüllerinin yüklenmemesidir ... ancak bu benim tahminimdir. Her neyse, window.onload=fn1;
modüller ile mükemmel şekilde çalışır ...