Akcje w html vs akcje w JS Opcje

[mat-bi]

Witam,

Może dziwnie tytuł brzmi, ale nie wiedziałem, jak to nazwać (IMG:style_emoticons/default/wink.gif)

Chodzi mi o to, jak to poprawniej jest?

[HTML] pobierz, plaintext 
<a href="#" onclick="sprawdz(1)">Sprawdź!</a>
[HTML] pobierz, plaintext 

czy

[HTML] pobierz, plaintext 
<a href="#" class="sprawdz" post_id="1">Sprawdź!</a>
[HTML] pobierz, plaintext 

i przypisanie onclick w js?

Kiedyś się uczyłem z książki o AJAX'ie, że poprawniejsza jest druga metoda, ale w końcu nie wiem, bo większość stron wykorzystuje pierwszą. To jak to w końcu jest?

Ten post edytował mat-bi 22.06.2011, 22:10:48

[zegarek84]

Kiedyś się uczyłem z książki o AJAX'ie, że poprawniejsza jest druga metoda, ale w końcu nie wiem, bo większość stron wykorzystuje pierwszą. To jak to w końcu jest?

każdy robi jak komu wygodniej i wszystko zależy od rozmachu jaki będzie miała "aplikacja" napisana w JS...

jednak ze swojej strony zalecam bindowanie elementów drzewa DOM z poziomu skryptów... lepiej sobie taki nawyk wyrobić zwłaszcza, jeśli kiedyś miałbyś pisać coś większego i chciałbyś skorzystać z dobrodziejstwa domknięć lub poukrywać pewne funkcje/metody przed światem...

[JAVASCRIPT] pobierz, plaintext 
(function(){
    function jakas1(){};
    var jakas2 = function(){};
})();
[JAVASCRIPT] pobierz, plaintext 

z poziomu html'a nie podepniesz zdarzeń do funkcji jakas1 i jakas2... poza tym, jeśli sobie wyrobisz dobre nawyki to zaczniesz może też buforować w zmiennych elementy drzewa DOM do ponownego ich wykorzystania a nie co chwila szukać je od nowa co jest znaczeni wolniejsze - inna sprawa, że w zasadzie każdy pomija takie kwestie optymalizacji...

[mat-bi]

Właśnie też mi sie wydaje, zę 2 sposób jest trochę lepszy i go zawsze stosuje.

[Crozin]

Podstawowe pytanie. Widziałeś gdzieś w specyfikacji HTML by dla elementu A był zdefiniowany atrybut POST_ID?

[mat-bi]

Wiem o tym, dlatego zapytałem sie, co jest poprawniejsze?

[kamil4u]

IMO najpoprawniej:

[HTML] pobierz, plaintext 
<span id="test">Kliknij</span>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
#test{
 color: blue;
 text-decoration: underline;
 /*i inne, żeby to wyglądało jak link -> np. łapka*/
}
[CSS] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
//1 -> addEventListener i attachEvent
// lub
//2 -> document.getElementById('test').onclick = ....
[JAVASCRIPT] pobierz, plaintext 

Na dobrą sprawę powinno się korzystać z pierwszego sposobu(1 w JS), ale osobiście, z przyzwyczajenia korzystam z 2(ma odrobinę mniejsze możliwości).

Polecam:
- https://developer.mozilla.org/pl/DOM/elemen...ddEventListener
- http://pornel.net/onclick (ma swoje lata)

Ten post edytował kamil4u 24.06.2011, 11:37:37

[Fifi209]

Na dobrą sprawę powinno się korzystać z pierwszego sposobu(1 w JS), ale osobiście, z przyzwyczajenia korzystam z 2(ma odrobinę mniejsze możliwości).

Chyba właśnie na odwrót, to sposób pierwszy ma mniejsze możliwości i moim zdaniem jest bardziej niepoprawny.

[kamil4u]

Zobacz co jest napisane w pierwszym linku jaki podałem (IMG:style_emoticons/default/smile.gif) - miłej lektury

--edit--
Pozwolę sobie jeszcze dorzucić(dla zainteresowanych): http://webhelp.pl/artykuly/obsluga-zdarzen-w-przegladarkach/

Ten post edytował kamil4u 24.06.2011, 11:49:24

[Fifi209]

Wybacz, pisząc pierwszy i drugi sposób myślałem, że odnosisz się do pierwszego postu autora - moje niedoczytanie, przepraszam. (IMG:style_emoticons/default/smile.gif)

[mat-bi]

Spokojnie, znam się na JS trochę, wiem o tym, jak zrobić to w JS (IMG:style_emoticons/default/smile.gif)

Co do @kamil4u, zgodzę się, ale jeżeli mam trochę takich samych linków, których chciałbym za raz oprogramować (np. generowanych przez foreach), a każdy z nich ma inny identyfikator(np. wspomniany już post_id), to co wtedy?

@EDIT:
tak BTW, jeżeli mam tylko jedną akcję na np. click, nie muszę korzystać z DOM wersja 2 (IMG:style_emoticons/default/smile.gif)

Ten post edytował mat-bi 24.06.2011, 16:45:40

[kamil4u]

Co do @kamil4u, zgodzę się, ale jeżeli mam trochę takich samych linków, których chciałbym za raz oprogramować (np. generowanych przez foreach), a każdy z nich ma inny identyfikator(np. wspomniany już post_id), to co wtedy?

Klasa + CSS? Chyba, że pytasz jak to ugryźć od sprawy JS. Sposobów jest wiele, np. stworzyć tablicę trzymającą odpowiednie informacje lub skorzystać z jakiegoś atrybutu - też zgodnie z jego przeznaczeniem.

Generalnie chodzi o to, żeby korzystać z elementów HTML zgodnie z ich przeznaczeniem. Link to <a>, a przypisując akcję nie korzystasz z ich funkcjonalności - stąd np. <span>.

@EDIT:
tak BTW, jeżeli mam tylko jedną akcję na np. click, nie muszę korzystać z DOM wersja 2 smile.gif

Nic nie musisz (IMG:style_emoticons/default/smile.gif) - jest to traktowane jako dobry nawyk, bo np.:
- masz czytelniejszy kod
- roboty wiedzą co indeksować, a co nie
- łatwość w późniejszej edycji
- mobilność kodu -> przy wykorzystywaniu przy innych projektach

[mat-bi]

Lekko odkopię (IMG:style_emoticons/default/smile.gif)

Ostatnio nad tym myślałem i wymyśliłem - a może np. id posta trzymać w JSON'ie ? Jak myślicie? Jako identyfikator pola np. id węzła

[kamil4u]

Opisz co chcesz dokładnie osiągnąć i w jakim przypadku. Często nie opłaca się tworzyć czegoś zaawansowanego do mniejszego projektu - wszystko zależy co potrzebujesz zrobić.

[zegarek84]

dokładnie tak jak napisał @kamil4u - zależy co miałeś na myśli...

zakładając, że całe drzewo DOM budujesz na podstawie formatu JSON to nawet id'ki można pominąć i w tym formacie stworzyć fikcyjne id'ki których nie przypisze się własnością a się rozpozna węzeł drzewa - fakt, przeczytałem to drugi raz i niejasno piszę więc głupoty - ale wszystko zależy od założeń - podobnie jeśli chcesz mieć źródło czystego xhtml'a to najprościej załadować dane z html'a i własności drzewa dom do formatu pośredniego (naturalnym jest w js json) i skorzystać z jakichś widoków i przekształcić to w xhtml'a - też głupoty piszę - ale tak mogą powiedzieć tylko Ci co piszą tylko na jedną przeglądarkę - akurat mechanika js wszędzie jest taka sama - ale nie wszystkie rzeczy wszędzie są zaimplementowane i nie wszędzie otrzymujemy ten sam kod html z innerHTML i jego odmian jak html() w jQuery (mam na myśli różnice w przeglądarkach)....

sorki za offtopick ;p