<script> etiketini </body> etiketinin arkasına yerleştirmek yanlış mı?

219

Betik etiketini gövdenin ( </body>) kapanış etiketinden sonra yerleştirmek ne kadar yanlıştır . ?

<html>
  ....
  <body>
     ....
  </body>
  <script type="text/javascript" src="theJs.js"></script>
</html>

javascript html

— danc
kaynak

1

Modern tarayıcılarda destek var mı?

— Xdrone

Olası yinelenen HTML biçimlendirme içinde <script> etiketleri koymalıyız Nerede?

— 19'da mapto

191

Veya etiketlerinin dışında doğrulama yapmaz . Ayrıca , gövde öğesi tamamen yüklenmeden IE'yi kırabilecek DOM manipülasyonları yapmazsanız - kapanmadan hemen önce koymak için çok fazla fark yaratmaz .<body><head></body>

<html>
  ....
  <body>
     ....
     <script type="text/javascript" src="theJs.js"></script>
  </body>
</html>

— Andy E
kaynak

13

@epalla: komut dosyasını gövde etiketinin sonuna koyarsanız, oraya kadar yüklenecek başka bir içerik kalmaz, bu yüzden dışarıya veya içeriye yerleştirmek arasında çok az fark olmalıdır. Daha sonra sayfanızın ek bir avantajı hala doğrulanıyor, bu da cevabımda yapmaya çalıştığım noktaydı.

— Andy E

1

Evet, cevabınız iyi olduğu için sizinle aynı fikirdeydim. Uzun zamandır yaptığımız gibi JS'yi sayfanın altına kafa yerine koymak için bir neden olduğunu eklemek istedim.

— Matt Brunmeier

3

@PHPst: geçersiz kod, bazı tarayıcılarda yan etkilere maruz kalabilir. Her iki durumda da, girintisinin yukarıdaki koddan daha az bir sekme genişliği olarak nasıl göründüğünü görmüyorum.

— Andy E

1

@PHPst: Kodunuzu gerçekten bu şekilde yazmak istiyorsanız tarayıcıların onunla başa çıkmasını beklerim. Yine de doğrulamak için kodunuzu yazmanızı tavsiye ederim.

— Andy E

1

@technosaurus: her zaman <script src="..." defer>, tüm büyük tarayıcılarda çalışır (IE9 ve daha düşük bir potansiyel kırılma hatası olsa da).

— Andy E

88

Evet. Yalnızca html öğesi için yorumlara ve bitiş etiketine, gövde için bitiş etiketinden sonra izin verilir.

Tarayıcılar hata kurtarma işlemi gerçekleştirebilir, ancak buna asla güvenmemelisiniz.

— Quentin
kaynak

12

Bu daha iyi bir cevap. Cep telefonunuzun devreye girmesi gereken çok fazla yeni tarayıcı var, tek yapmanız gereken tek bir kapatma etiketini kesmek ve yapıştırmak olduğunda yanlış yapmayı riske atmak.

— Erik Reppen

33

As Andy belge geçerli, ama yine de senaryo yine yorumlanacaktır değil olacağını söyledi. Örneğin WebKit'ten snippet'e bakın :

void HTMLParser::processCloseTag(Token* t)
{
    // Support for really broken html.
    // we never close the body tag, since some stupid web pages close it before 
    // the actual end of the doc.
    // let's rely on the end() call to close things.
    if (t->tagName == htmlTag || t->tagName == bodyTag 
                              || t->tagName == commentAtom)
        return;
    ...

— Vitalii Fedorenko
kaynak

11

"Gerçekten kırık html desteği." - Sanırım her şeyi söylüyor.

— Diogo Kollross

8

IE artık buna izin vermiyor (Sürüm 10'dan beri inanıyorum) ve bu tür komut dosyalarını göz ardı edecek. FF ve Chrome hala onları tolere ediyor, ancak bir gün bunu standart dışı bırakmaları ihtimali var.

— Bronx
kaynak

1

Yine de Google bunu, "son güncelleme: 10 Nisan 2014" ile G + oturum açma işleminin nasıl yapılacağı örneğinde yapıyor. Sunucudaki Java sürümünden ( developers.google.com/+/quickstart/java ) aldım ama muhtemelen herkes için aynı HTML + js.

— Tom

2

"Element komut dosyası" , W3C tarafından önerilen işlem tarafından "ayrıştırma hatası" olduktan sonra yordamsal olarak "element komut dosyasını" ekleyin . "Ağaç Yapısı" nda hata oluşturun ve bu içeriği işlemek için "tekrar tokenize" komutunu çalıştırın. Bu ek bir adım gibi. Ancak bundan sonra "Betik Yürütme" çalıştırılabilir - şema sürecine bakın .

Başka bir şey "ayrıştırma hatası". "Ekleme modunu" "gövde içinde" olarak değiştirin ve jetonu yeniden işleyin.

Teknik olarak tarayıcı tarafından dahili süreç, nasıl işaretleyip optimize ettikleri.

Umarım birine yardım etmişimdir.

— BG Bruno
kaynak

0

Evet. Ancak kodu dışında eklerseniz, çoğu tarayıcı bunu düzelteceğinden, muhtemelen dünyanın sonu olmayacaktır, ancak yine de girmek kötü bir uygulamadır.

— Taylor Satula
kaynak

0

Google bunu aslında 'CSS Optimizasyonu' konusunda önerir. Kritik üst kat stillerini astarlamayı ve geri kalanını ertelemeyi önerirler (css dosyası).

Misal:

<html>
  <head>
    <style>
      .blue{color:blue;}
    </style>
    </head>
  <body>
    <div class="blue">
      Hello, world!
    </div>
  </body>
</html>
<noscript><link rel="stylesheet" href="small.css"></noscript>

Bkz. Https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery

— Donald Porter
kaynak

8

bodyÖğeyi öğenin dışına koymanız gerekmiyor . Bu Google makalesi kimseye böyle bir şey yapmasını önermez.

— ChaseMoskal

2

Korkarım google sayfası aslında tam olarak bunu söylüyor.

— 10us

6

Sayfa yani bir defada gibi görünüyor vermedi artık değil böyle bir şey tavsiye, ama. (Şimdi javascript ile bazı dinamik yükleme var.) Almanca sürümü güncel değil ve hala eski kod örneğini içeriyor.

— bodo

1

"element noscript" de "element html" ve "element body" içinde RFC tarafından bulunmalıdır

— BG Bruno

0

Modern tarayıcılar vücutta komut dosyası etiketlerini şu şekilde alacaktır:

<body>
    <script src="scripts/main.js"></script>
</body>

Temel olarak, komut dosyası sayfa bittikten sonra yüklenecektir, bu da belirli durumlarda yararlı olabilir (DOM işleme). Ancak, aynı betiği almanızı ve aynı efekti vereceği için "erteleme" ile baş etiketine koymanızı önemle tavsiye ederim.

<head>
    <script src="scripts/main.js" defer></script>
</head>

— Reklam Hayır Kurumu
kaynak

Yararlı olacak olan şey, scriptetiketlerin eventkomut dosyasını ne zaman ayrıştıracağını belirlemek için tanımlanabilecek bir niteliğe sahip olmasıdır. Bu yüzden event="load" event="DOMContentLoaded"DOM oluşturulduktan sonra veya event="beforeunload"pencere beforeunloadolayında komut dosyasını çalıştırmanız gerekir . Örnek <script src="scripts/main.js" event="DOMContentLoaded"></script>,.

— 1.21 gigawatts