Когда задачу можно выполнить с помощью Javascript или CSS, лучше ли использовать CSS? [закрыто]

Я всегда накладываю вето на JavaScript, максимально используя CSS.

т.е. я создаю вкладки и кнопки прокрутки, используя CSS, а не JavaScript.

Я видел несколько решений, в частности веб-фреймворк Wt, которые поддерживают JavaScript; но изящно опуститесь до CSS, если браузер не поддерживает / js-disabled.

Я знаю, что CSS и JavaScript имеют разные цели, однако они частично совпадают; что является основой этого вопроса.

Должен ли я продолжать использовать CSS как можно больше по сравнению с JavaScript?

Да.

Цель CSS - верстка, внешний вид и анимация

Целью JavaScript является взаимодействие.

Если вы делаете макет, используйте CSS, если вы настраиваете внешний вид, используйте CSS, если ваша анимация использует CSS3

Если вы присоединяете обработчики событий или реагируете на пользовательский ввод, используйте JavaScript.

Обратите внимание, что люди используют JavaScript вместо CSS для поддержки браузера. Существуют и другие решения, такие как эмуляция функций CSS с использованием JavaScript.

Ну, это на самом деле довольно интересный вопрос. Я пытаюсь придумать, как вы могли бы сделать эталонный тест для чего-то подобного, тем более, что большую часть времени ни CSS, ни JavaScript не будут делать действительно ресурсоемкие вещи на веб-странице.

Мой интуитивный настрой сказал бы, что используй CSS как можно больше, но не превращай это в жесткое и быстрое правило.

a:hover {
  background-color: green;
}

тогда лучше семантически

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

НО

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

было бы сложно (хотя и не невозможно) в CSS. Вы могли бы сделать это таким образом.

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

a.green {
  background-color: green;
}

Это действительно был бы немного более неловкий способ сделать то, что могло бы быть сделано непосредственно в JavaScript, но я думал об этом пару минут, и даже здесь, например, правильным решением может быть CSS. если вы устанавливаете много атрибутов при выполнении наведения.

** Обратите внимание, что ни один из этого кода не будет работать, это только для демонстрационных целей. **

Подумайте, хотите ли вы следующее из Сети разработчиков Yahoo :

«После подсчета цифр мы обнаружили постоянную частоту запросов с отключенным JavaScript, которые составляют около 1% от фактического трафика посетителей, при этом самый высокий показатель составляет около 2% в Соединенных Штатах, а самый низкий - около 0,25% в Бразилии. другие протестированные страны показали цифры, близкие к 1,3 процента ".

При таком низком процентном отношении (как максимум) вряд ли стоит (если только пользователи ваших веб-сайтов не получают в основном эти 2%) беспокоиться о том, что у пользователей отключен JavaScript. Обычный пользователь не знает, как отключить JavaScript, и, вероятно, не заботится об этом. Если вы разрабатываете технический веб-сайт, вы можете рассмотреть возможность того, что они отключат JavaScript, однако, если они есть, они, вероятно, привыкли к сайтам, работающим некорректно, так как многие веб-сайты активно используют JavaScript.

При этом я обнаружил много случаев, когда разработка javascript значительно облегчает то, что я пытаюсь выполнить, и другие случаи, когда css делает то же самое.

В конце концов, каждый «язык» занимает свое место в веб-разработке и используется с умом, что может улучшить как разработку, так и взаимодействие с пользователем. Узнайте, что это такое (я рекомендую опыт обучения) и применять с умом. По моему опыту, установленные в камне правила, такие как «Никогда не используйте JS, когда существует CSS-решение» (перефразированный), редко бывают лучшими в практическом мире.

JavaScript - это настоящий компьютерный язык, то есть он имеет состояние и контроль выполнения программы. Таким образом, нет предела тому, насколько сложным он может быть, и все, что вы пишете в нем, обязательно будет иметь существенный минимум сложности. CSS - это описательный код; его сложность ограничена уровнем сложности, который может иметь рецепт. Поэтому, если что-то можно сделать как в CSS, так и в JavaScript, я бы предпочел использовать CSS, поскольку он должен быть менее сложным.

Javascript - это язык сценариев, что означает, что он может добавить немного логики. CSS используется для описания внешнего вида и стиля документа. Он был разработан прежде всего для отделения структуры документа от форматирования и макета (презентации).

Вы можете использовать Javascript для изменения внешнего вида веб-страницы, но так как CSS предназначался для этого, я бы выбрал CSS для стиля сайта, а остальное оставлю на усмотрение Javascript.

Википедия:

Использование Javascript:

• Открытие или отображение нового окна с программным управлением размером, положением и атрибутами нового окна (например, видны ли меню, панели инструментов и т. Д.).
• Проверка входных значений веб-формы, чтобы убедиться, что они приемлемы перед отправкой на сервер.
• Изменение изображений при наведении на них курсора мыши. Этот эффект часто используется для привлечения внимания пользователя к важным ссылкам, отображаемым в виде графических элементов.

ОБНОВИТЬ. Что касается третьего пункта, W3C говорит о CSS:

:hoverПсевдо-класс применяется , когда пользователь обозначает элемент с указательным устройством, но не обязательно активировать его. Например, визуальный пользовательский агент может применить этот псевдокласс, когда курсор (указатель мыши) находится над блоком, созданным элементом.

Использование CSS:

До CSS почти все атрибуты представления документов HTML содержались в разметке HTML; все цвета шрифта, стили фона, выравнивание элементов, границы и размеры должны были быть явно описаны, часто многократно, в HTML. CSS позволяет авторам перемещать большую часть этой информации в отдельную таблицу стилей, что значительно упрощает разметку HTML.