CSS, Javascript los van HTML
Door CB2thephp , 21 jaar geleden, 7.019x bekeken
Hoe krijg je CSS en Javascript (AJAX) gescheiden van HTML, ervaring javascript en CSS vereist.
Gesponsorde koppelingen
Inhoudsopgave
Er zijn 6 reacties op 'Css javascript los van html'
0 
-0 
-0
Je kunt reageren, maar svp denk aan mijn memo's in de conclusie om de reacties nuttig te houden.
Greetz,
Christian Bolster
Greetz,
Christian Bolster
0 -0
-0
Correctie: 'myrules is een array' moet zijn 'myrules is een object'. Dit fenomeen heet 'unobtrusive' javascript. Ik vind de implementatie van je event handler vrij over-the-top. Het kan een stuk makkelijker, zoals bijvoorbeeld onderstaand script:
Op deze manier is het ook mogelijk om meerdere events van hetzelfde type aan een object te hangen. Iets wat bij jouw behaviour script niet mogelijk is.
Dan webb's scripting essentials zijn een goede verzameling van aanvullingen voor dit type javascripting.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
function addEvent(obj, eventType, fn, useCapture) {
if (obj.addEventListener) {
obj.addEventListener(eventType, fn, useCapture);
return true;
}
else if (obj.attachEvent) {
var r = obj.attachEvent("on"+eventType, fn);
return r;
}
}
var myObject = document.getElementById("mijnUrl");
addEvent( myObject, 'click', function() { alert( "jaja, er is op mij geklikt!" ); }, false);
if (obj.addEventListener) {
obj.addEventListener(eventType, fn, useCapture);
return true;
}
else if (obj.attachEvent) {
var r = obj.attachEvent("on"+eventType, fn);
return r;
}
}
var myObject = document.getElementById("mijnUrl");
addEvent( myObject, 'click', function() { alert( "jaja, er is op mij geklikt!" ); }, false);
Op deze manier is het ook mogelijk om meerdere events van hetzelfde type aan een object te hangen. Iets wat bij jouw behaviour script niet mogelijk is.
Dan webb's scripting essentials zijn een goede verzameling van aanvullingen voor dit type javascripting.
0 -0
-0
In deze tutorial staat ook nog een stukje over events, maar dan wat minder extreem. Meer de kant die Pim al geeft.
0 -0
-0
Jelmer en Pim Lees aub de teksten goed door. De event handlers zijn niet door mij gemaakt, maar door Ben Nolan. Want dit komt uit het bestand behaviour.js h?. Dus bij dit soort fouten graag melden bij Ben Nolan zelf. Hij zal het dan upgraden naar een nieuwe versie. Ik wil graag jullie tutorials bekijken, want dan leer ik meer over events, maar de events hierin gemaakt zijn niet van mij dus lees de volgende beter ;)
@Pim ik zal mijn fout corrigeren over de array, trouwens de unobtrusive staat in mijn tekst.
Ik hoop dat jullie mijn punt hierboven begrijpen
Greetz,
Christian Bolster
@Pim ik zal mijn fout corrigeren over de array, trouwens de unobtrusive staat in mijn tekst.
Ik hoop dat jullie mijn punt hierboven begrijpen
Greetz,
Christian Bolster
0 -0
-0
Wat wij zeggen is dat jou aanpak van Javascript koppelen aan HTML nogal een drastische aanpak is. Het heeft meer overeenkomsten met CSS en XBL dan met Javascript. Een wat lichtere manier is het gebruik van addEvent, zoals ik in mijn tutorial besprak.
AddEvent is niets meer dan een functie aanroepen die een link legt tussen het drukken op een knop en het uitvoeren van een functie. Voordeel van deze simpele methode is dat je hem veel gerichter kan toepassen. Nadeel is dat waneer je meerdere elementen wilt voorzien van event listeners, dan zal je zelf een for-lusje moeten maken.
Wat dit als kritiek is op je tutorial? Je zegt dat het Behavior-script de beste oplossing is, maar geeft niet aan welke andere mogelijkheden er waren noch argumenten waarom het de beste oplossing is.
Wat jij doet is een beetje vergelijkbaar met het MVC pattern uitleggen, en zeggen dat de View in MVC Smarty of een andere template-parser moet zijn, terwijl PHP zelf dit ook prima voor zijn rekening kan nemen. En het argument dat 'je de designer niet met code wilt laten schrikken' gaat niet op voor Javascript mag ik hopen ;)
edit: het is overigens fijn dat iemand hier eens een tutorial over schrijft, want inderdaad met de opkomst van de AJAX-aapjes is het wel handig ze een schop in de goede richting te geven :)
AddEvent is niets meer dan een functie aanroepen die een link legt tussen het drukken op een knop en het uitvoeren van een functie. Voordeel van deze simpele methode is dat je hem veel gerichter kan toepassen. Nadeel is dat waneer je meerdere elementen wilt voorzien van event listeners, dan zal je zelf een for-lusje moeten maken.
Wat dit als kritiek is op je tutorial? Je zegt dat het Behavior-script de beste oplossing is, maar geeft niet aan welke andere mogelijkheden er waren noch argumenten waarom het de beste oplossing is.
Wat jij doet is een beetje vergelijkbaar met het MVC pattern uitleggen, en zeggen dat de View in MVC Smarty of een andere template-parser moet zijn, terwijl PHP zelf dit ook prima voor zijn rekening kan nemen. En het argument dat 'je de designer niet met code wilt laten schrikken' gaat niet op voor Javascript mag ik hopen ;)
edit: het is overigens fijn dat iemand hier eens een tutorial over schrijft, want inderdaad met de opkomst van de AJAX-aapjes is het wel handig ze een schop in de goede richting te geven :)
0 -0
-0
Sorry, ik wist niet van andere methodes, ik wil graag kijken naar andere methodes, toch heeft deze methode 1 voordeel. Het is simpel en dus niet moeilijk te bevatten, ik hoop dat je deze argument niet erg vindt.
Ik zal van het weekend kijken in jou gegeven methodes en dan proberen erbij toe te voegen
Greetz,
Christian Bolster
Ik zal van het weekend kijken in jou gegeven methodes en dan proberen erbij toe te voegen
Greetz,
Christian Bolster
Om te reageren heb je een account nodig en je moet ingelogd zijn.
PHP hulp
0 seconden vanaf nu