Kiedy zadanie można wykonać za pomocą Javascript lub CSS, czy lepiej jest używać CSS? [Zamknięte]

Zawsze zawetowałem JavaScript, używając CSS w jak największym stopniu.

tzn. tworzę karty i przyciski najazdu używając CSS zamiast JavaScript.

Widziałem pewne rozwiązania - w szczególności framework internetowy Wt - które wspierają JavaScript; ale z wdziękiem zmień wersję na CSS, jeśli przeglądarka nie obsługuje / js-disabled.

Wiem, że CSS i JavaScript mają różne cele, jednak nakładają się; co jest sednem tego pytania.

Czy powinienem nadal używać CSS jak najwięcej w JavaScript?

Tak.

Celem CSS jest układ, wygląd i działanie oraz animacje

Celem JavaScript jest interakcja.

Jeśli wykonujesz układ, użyj CSS, jeśli ustawiasz wygląd i działanie, użyj CSS, jeśli twoja animacja używa CSS3

Jeśli dołączasz procedury obsługi zdarzeń lub reagujesz na dane wejściowe użytkownika, użyj JavaScript.

Pamiętaj, że ludzie używają JavaScript zamiast CSS do obsługi przeglądarki. Istnieją inne rozwiązania, takie jak emulowanie funkcji CSS za pomocą javascript.

To właściwie interesujące pytanie. Próbuję wymyślić, w jaki sposób zrobiłbyś nawet test porównawczy na czymś takim, tym bardziej, że ani CSS, ani JavaScript nie robią naprawdę intensywnych obliczeniowo rzeczy na stronie internetowej.

Moje przeczucie powiedziałoby, że używam CSS tak często, jak to możliwe, ale nie rób z tego trudnej i szybkiej reguły.

a:hover {
  background-color: green;
}

jest więc lepiej semantycznie

$('a').onmouseover(function() {
  $(this).css('background-color','green');
})

ALE

$('a').onmouseover(function() {
  if (somethingelsehappened) {
    $(this).css('background-color','green');
  }
})

byłoby trudne (choć nie niemożliwe) w CSS. Możesz to zrobić w ten sposób.

$('a').onmouseover(function() {
  if (somethingelsehappened) {
    $(this).addClass('Green');
  }
})

a.green {
  background-color: green;
}

Byłby to naprawdę nieco bardziej niezręczny sposób, aby zrobić to, co można było zrobić bezpośrednio w JavaScript, ale zastanawiałem się nad tym przez kilka minut i nawet tutaj właściwym rozwiązaniem może być na przykład CSS jeśli ustawiałeś wiele atrybutów podczas najechania kursorem.

** Należy pamiętać, że żaden z tych kodów nie powinien działać, są one wyłącznie w celach demonstracyjnych. **

Zastanów się, czy będziesz robił następujące rzeczy z Yahoo Developer Network :

„Po skurczeniu się liczb znaleźliśmy stały odsetek żądań z wyłączoną obsługą JavaScript, które oscylowały wokół 1% rzeczywistego ruchu odwiedzających, przy czym najwyższy wskaźnik wynosił około 2 procent w Stanach Zjednoczonych, a najniższy około 0,25 procent w Brazylii. w pozostałych testowanych krajach liczba ta była bardzo bliska 1,3% ”.

Przy tak niskim odsetku (jako maksimum) nie wydaje się to warte (chyba że użytkownicy twoich stron pochodzą głównie z tych 2%), aby martwić się przypadkiem, w którym użytkownicy mają wyłączony javascript. Przeciętny użytkownik nie wie, jak wyłączyć javascript, i prawdopodobnie nie obchodzi go to. Jeśli tworzysz witrynę techniczną, możesz rozważyć możliwość wyłączenia javascript, ale jeśli tak, to prawdopodobnie są przyzwyczajeni do stron internetowych, które nie działają poprawnie, ponieważ wiele stron internetowych intensywnie używa javascript.

To powiedziawszy, znalazłem wiele przypadków, w których tworzenie javascript sprawia, że ​​to, co próbuję osiągnąć, jest znacznie łatwiejsze, a inne przypadki, w których css robi to samo.

Ostatecznie każdy „język” ma swoje właściwe miejsce w tworzeniu stron internetowych i mądrze używany może poprawić zarówno rozwój, jak i wygodę użytkownika. Dowiedz się, jakie są te zastosowania (polecam doświadczenie uczenia się) i stosuj mądrze. Z mojego doświadczenia wynika, że ​​określone w kamiennych regułach takie jak: „Nigdy nie używaj JS, gdy istnieje rozwiązanie CSS” (sparafrazowane) rzadko są najlepsze w praktycznym świecie.

JavaScript jest prawdziwym językiem komputerowym, co oznacza, że ​​ma stan i kontrolę nad wykonywaniem programu. W związku z tym nie ma górnego limitu złożoności, a wszystko, co w nim piszesz, musi mieć znaczną minimalną złożoność. CSS jest kodem opisowym; jego złożoność jest ograniczona do poziomu złożoności, jaki może mieć przepis. Dlatego jeśli coś można zrobić zarówno w CSS, jak i JavaScript, wolałbym raczej używać CSS, ponieważ jest on mniej skomplikowany.

JavaScript jest językiem skryptowym, co oznacza, że ​​można dodać logikę. CSS służy do opisu wyglądu i stylu dokumentu. Został zaprojektowany przede wszystkim w celu oddzielenia struktury dokumentu od formatowania i układu (prezentacji).

Możesz użyć Javascript, aby zmodyfikować wygląd strony, ale ponieważ CSS miał to zrobić, wybrałbym CSS dla stylu strony, a resztę pozostawiłem Javascript.

Wikipedia:

Używanie Javascript:

• Otwieranie lub otwieranie nowego okna z programową kontrolą rozmiaru, położenia i atrybutów nowego okna (np. Czy menu, paski narzędzi itp. Są widoczne).
• Sprawdzanie poprawności wartości wejściowych formularza internetowego w celu upewnienia się, że są one dopuszczalne przed przesłaniem ich na serwer.
• Zmiana obrazów w miarę przesuwania się nad nimi kursora myszy: Ten efekt jest często używany do zwrócenia uwagi użytkownika na ważne linki wyświetlane jako elementy graficzne.

AKTUALIZACJA. Co do trzeciego punktu, W3C mówi o CSS:

:hoverPseudo-klasa ma zastosowanie, gdy użytkownik wyznacza element z urządzeniem wskazującym, ale niekoniecznie go uaktywnić. Na przykład wizualny agent użytkownika może zastosować tę pseudoklasę, gdy kursor (wskaźnik myszy) unosi się nad polem wygenerowanym przez element.

Zastosowanie CSS:

Przed CSS prawie wszystkie atrybuty prezentacji dokumentów HTML były zawarte w znacznikach HTML; wszystkie kolory czcionek, style tła, wyrównanie elementów, obramowania i rozmiary musiały być wyraźnie opisane, często wielokrotnie, w kodzie HTML. CSS pozwala autorom przenieść większość tych informacji do osobnego arkusza stylów, co znacznie ułatwia znaczniki HTML.