script binnen html tag

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

N K

N K

10/09/2012 19:28:00
Quote Anchor link
Misschien een stomme vraag maar is het erg om een script binnen html tags te zetten ipv head tags?

Ik maak gebruik van php variabelen in mijn javascript die pas na de head gedefinieerd worden, vandaar dat ik het script na mijn php code wil plaatsen.
Normaal voer ik de meeste php code uit voor mijn html code maar in dit geval is het wat lastiger.
 
PHP hulp

PHP hulp

06/12/2019 03:45:51
 
Eddy E

Eddy E

10/09/2012 19:39:52
Quote Anchor link
Gaat neem ik aan wel om Javascript en niet om PHP?


Nee, zolang het maar in de <script>-tags gaat.
Daarnaast wordt het juist niet aangeraden om Javascripts in de head te zetten. Maar net boven de </body> tag, dus 2 (of 3) regels van onderen.
Eerst je HTML, dan je Javascripts.
 
N K

N K

10/09/2012 19:42:33
Quote Anchor link
oke, dat is nieuw voor mij.
Ik zet altijd mijn javascripts in mijn head. Als ik het goed begrijp kan ik dat dus vanaf nu het beste aan het einde doen.
 
Eddy E

Eddy E

10/09/2012 19:45:23
Quote Anchor link
Ja, waarom zal je de pagina-load vertragen door Javascripts die toch nog niets (behoren en) kunnen doen. De DOM is toch nog niet klaar.
Eerst HTML, dan CSS, dan Javascript, dan plaatjes, dan.....

In Opera heb je een Element Inspector (net als Chrome/FF etc), maar je kan ook zien wat, wanneer en hoe snel iets werd opgehaald.
Daar is winst in te halen.
Een leuk script dat een dingetje laat bewegen (wat totaal niet nodig is) moet echt pas komen als de pagina klaar is.
Niet dat de tekst later komt omdat jQuery volledig ingeladen moet worden.
 
N K

N K

10/09/2012 19:46:16
Quote Anchor link
Heldere uitleg! Bedankt Eddy.
 
Eddy E

Eddy E

10/09/2012 19:50:23
Quote Anchor link
Voorbeeldje van het W3C.. omdat die als een van de weinige geen Javascript-fouten heeft (deviantart.com wel):

http://s11.postimage.org/wgvg5epu7/w3cloading.jpg

Mmm die foto-toon-dinges is naar de klote (bij mij dan....)

Directe link: http://postimage.org/image/wgvg5epu7/
Gewijzigd op 10/09/2012 19:51:44 door Eddy E
 
Wouter J

Wouter J

10/09/2012 19:50:46
Quote Anchor link
Bedenk wel dat als je dingen hebt die meteen moeten werken je hem natuurlijk wel bovenaan moet zetten. Denk bijv. aan html5shiv voor het laten werken van HTML5 in IE8- of modernizr voor het checken van browser support.

Of als je bijv. een input value veranderd. Hardstikke irritant als je al je username aan het typen bent en dan het javascriptje opeens geladen is en de value voor je veranderd, kun je weer opnieuw beginnen...

Het is dus verstandig om het te doen, maar bedenk wel goed wat je wel en wat je niet doet.


Tevens, wat bedoel je binnen de HTML tag? Even muggenziften: het is het HTML element... :-)
Maar daarnaast, het HTML element is het rootelement van het document. Het behoord 2 children te hebben: Het HEAD element, met data die belangrijk is voor het browser en niet voor de gebruiker, en het BODY element, met de 'body' van de website.
 
John Berg

John Berg

10/09/2012 20:10:14
Quote Anchor link
Eddy Erkelens op 10/09/2012 19:45:23:
Ja, waarom zal je de pagina-load vertragen door Javascripts die toch nog niets (behoren en) kunnen doen. De DOM is toch nog niet klaar.
Eerst HTML, dan CSS, dan Javascript, dan plaatjes, dan.....


Woeh .. hier zit toch wel een kardinale denkfout in!! De DOM is nog niet klaar .. dom .. dom .. dom ..
Alle moderne browsers laden scripts en css asynchroon, wat betekend dat aan het laden van scripts, css e.d. begonnen word zodra dat kan. Door de latentie, response van de server en download tijd is een script pas na een bepaalde tijd geladen. Terwijl het script laadt, gaat de browser door met het bouwen van de DOM en met renderen, wat vaak veel vlugger gaat dan dat het script beschikbaar is.

Zet je het script achteraan, dan gaat eerst de DOM gebouwd worden , dan wordt gerenderd en daarna pas scripts geladen worden. Daarmee gaat kostbare tijd verloren en wordt je pagina traag.
 
Wouter J

Wouter J

10/09/2012 20:46:15
Quote Anchor link
John, ook jij maakt anders ook 2 denkfouten, of misschien meer fouten omdat je niet precies weet wat er gebeurd...

Verklaar mij maar eens de resultaten van dit simpele HTML/JS testje: http://jsbin.com/atuhig/1/edit

Toevoeging op 10/09/2012 20:46:18:

John, ook jij maakt anders ook 2 denkfouten, of misschien meer fouten omdat je niet precies weet wat er gebeurd...

Verklaar mij maar eens de resultaten van dit simpele HTML/JS testje: http://jsbin.com/atuhig/1/edit
 
John Berg

John Berg

10/09/2012 20:49:29
Quote Anchor link
Wouter: volgens mij ging het om waar je de javascript externe files moest neer zetten, in de head of onderaan. Dit gaat over inline javascript. Je vergelijkt appels met peren.
 
Reshad F

Reshad F

10/09/2012 23:04:30
Quote Anchor link
Ik denk toch echt dat Wouter hier gelijk heeft. js tussen de head tags zetten is niet altijd goed maar in sommige gevallen noodzakelijk.

hier geld het volgende meestal voor: js met grafische doeleinden tussen de head en functionele js net voor de </body> tag

@John bij een externe file is het ook zo dat wanneer de browser de src attribuut tegenkomt hij deze eerst laad en dan vervolgens verder gaat met html parsen. het hoeft dus niet zo te zijn dat wanneer je externe files hebt je deze altijd bovenaan moet zetten deze kunnen ook prima onderaan mochten het functionele eigenschappen hebben en geen grafische.
 
Erwin H

Erwin H

11/09/2012 09:08:48
Quote Anchor link
N K op 10/09/2012 19:28:00:
Ik maak gebruik van php variabelen in mijn javascript die pas na de head gedefinieerd worden, vandaar dat ik het script na mijn php code wil plaatsen.

Dan kan je ook gewoon de structuur van je script aanpassen. Wat let je om de html head niet meteen naar het scherm te sturen, maar nog even in geheugen te houden. Een net script handelt eerst alle php af, voordat het output naar de browser stuurt.
 
Eddy E

Eddy E

11/09/2012 09:25:57
Quote Anchor link
Je website behoort toch zonder Javascript ook te werken?
En, als voorbeeld, jQuery ga je ook pas gebruiken nadat de pagina geladen is (kortom: de DOM klaar is). Dat is niet voor niets.

Ik kan me ook niet voorstellen dat je eerst even wat Javascript nodig hebt alvorens de rest van de HTML te (kunnen) gebruiken zoals jij wilt.

Javascript = leuk extraatje maar niet vereist.
 
Kris Peeters

Kris Peeters

11/09/2012 11:43:16
Quote Anchor link
John Berg op 10/09/2012 20:49:29:
Wouter: volgens mij ging het om waar je de javascript externe files moest neer zetten, in de head of onderaan. Dit gaat over inline javascript. Je vergelijkt appels met peren.


Maakt dat dan een verschil?

Wanneer je een library laadt in een aparte file; een framework of zelfgeschreven functies;
en dan heb je een eigen script, dat daar gebruik van maakt ...

Dan maakt het toch niet uit wat in een file staat en wat inline.
Sowieso moet een script volledig wachten op ALLES van script dat boven in de HTML-code staat (hoger in de broncode ...).

bv. als je jQuery gebruikt, mag pas aan gelijk welk script begonnen worden nadat jQuery volledig geladen is (jQuery staat dan hoger in de broncode dan de rest...). Of je script inline is of in een file; of je jQuery inline copy/paste (niet dat dit aan te raden valt) en je script in een file apart zet ...
dat maakt toch allemaal niet uit?

Dit klinkt niet echt Asynchroon
Gewijzigd op 11/09/2012 11:56:27 door Kris Peeters
 
Eddy E

Eddy E

11/09/2012 12:02:37
Quote Anchor link
De browser opent meerdere bestanden tegelijkertijd.
Kijk nog eens naar dit: http://postimage.org/image/wgvg5epu7/full/

Terwijl de (bovenste rij) pagina nog geladen wordt worden er ondertussen al wat stijlbladen en afbeeldingen gedownload. Eerst alle HTML, dan alle andere dingen.
Dus niet als er een <img> komt, dat de HTML gaat wachten tot die afbeelding geladen is.
 
Kris Peeters

Kris Peeters

11/09/2012 12:12:28
Quote Anchor link
Ja, het <img> element is wel een mooi voorbeeld van Asynchroon laden.
Je kan daar zelfs actief gebruik van maken. bv. CAPTCHA gebruikt het asynchrone verzoek om een code in een $_SESSION var te steken.

Ook heeft een andere <img> geen nood om te wachten op een andere <img>.

Een zelfde analogie kan ik maar moeilijk zien wanneer het om scripts gaat.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.