저는 항상 CSS를 최대한 많이 사용하여 JavaScript를 거부합니다.
즉, JavaScript가 아닌 CSS를 사용하여 탭과 롤오버 버튼을 만듭니다.
JavaScript를 옹호 하는 솔루션, 특히 Wt 웹 프레임 워크를 보았습니다 . 브라우저가 가능하지 않거나 JS를 사용할 수없는 경우 CSS로 정상적으로 다운 그레이드하십시오.
CSS와 JavaScript의 목적이 다르지만 중복되는 부분이 있습니다. 이는입니다 본 쉘 이 질문의.
JavaScript를 통해 가능한 한 CSS를 계속 사용해야합니까?
답변:
예.
CSS의 목적은 레이아웃, 룩앤필 및 애니메이션입니다
자바 스크립트의 목적은 상호 작용입니다.
레이아웃을 수행하는 경우 CSS를 사용하고, 모양과 느낌을 설정하려면 CSS를 사용하고, 애니메이션을 수행 할 때 CSS3을 사용하는 경우
이벤트 핸들러를 첨부하거나 사용자 입력에 반응하는 경우 JavaScript를 사용하십시오.
사람들은 브라우저 지원을 위해 CSS 대신 JavaScript를 사용합니다. javascript를 사용하여 CSS 기능을 에뮬레이트하는 것과 같은 다른 솔루션이 있습니다.
글쎄, 그것은 실제로 꽤 흥미로운 질문입니다. 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 개발자 네트워크 에서 다음 사항을 고려하십시오 .
"우리는이 수치를 파악한 후 실제 방문자 트래픽의 약 1 %를 차지하는 일관된 JavaScript 비활성화 요청 비율을 발견했습니다. 미국에서 가장 높은 비율은 약 2 %, 브라질에서 가장 낮은 비율은 약 0.25 %입니다. 다른 국가들도 1.3 %에 가까운 수치를 보여 주었다. "
백분율이 너무 낮 으면 (최대) 웹 사이트 사용자가 주로 2 %를 차지하지 않는 한 사용자가 자바 스크립트를 끈 경우에 대해 걱정할 가치가 없습니다. 일반 사용자는 자바 스크립트를 끄는 방법을 모르며 신경 쓰지 않을 것입니다. 기술 웹 사이트를 개발하는 경우 Javascript를 비활성화했을 가능성을 고려할 수도 있지만 많은 웹 사이트에서 javascript를 많이 사용하므로 제대로 작동하지 않는 웹 사이트에 익숙 할 가능성이 높습니다.
내가 말한 것은 자바 스크립트 개발로 인해 내가 더 쉽게 달성하려고하는 것을 만들고 CSS가 동일한 다른 경우를 발견했습니다.
결국 각 "언어"는 웹 개발에서 적절한 위치에 있으며 현명하게 사용하여 개발 및 사용자 경험을 향상시킬 수 있습니다. 그 사용이 무엇인지 배우고 (경험 학습을 권장합니다) 현명하게 적용하십시오. 내 경험상 "CSS 솔루션이있을 때 JS를 사용하지 마십시오"와 같은 기본 규칙 (실제 그림)이 실제 세계에서는 거의 최고가 아닙니다.
JavaScript는 실제 컴퓨터 언어이므로 프로그램 실행 상태 및 제어 권한이 있음을 의미합니다. 따라서 얼마나 복잡 할 수 있는지에 대한 상한은 없으며, 사용자가 작성하는 내용에는 최소한의 복잡성이 있어야합니다. CSS는 설명 코드입니다. 그 복잡성은 레시피가 가질 수있는 복잡성 수준으로 제한됩니다. 따라서 CSS와 JavaScript 모두에서 무언가를 수행 할 수 있다면 덜 복잡하기 때문에 CSS를 사용하는 것이 좋습니다.
Javascript는 스크립팅 언어로, 논리를 추가 할 수있는 기능이 있습니다. CSS는 문서의 모양과 스타일을 설명하는 데 사용됩니다. 주로 문서 구조를 서식 및 레이아웃 (프레젠테이션)과 분리하도록 설계되었습니다.
Javascript를 사용하여 웹 페이지의 모양을 수정할 수 있지만 CSS는 그렇게하기 위해 사이트 스타일에 CSS를 사용하고 나머지는 Javascript로 남겨 둡니다.
위키 백과 :
자바 스크립트 사용 :
- 새 창의 크기, 위치 및 속성 (예 : 메뉴, 도구 모음 등의 표시 여부)을 프로그래밍 방식으로 제어하여 새 창을 열거 나 팝업.
- 서버에 제출하기 전에 웹 양식의 입력 값이 올바른지 확인하십시오.
- 마우스 커서가 움직일 때 이미지 변경 :이 효과는 종종 그래픽 요소로 표시되는 중요한 링크에 대한 사용자의주의를 끌기 위해 사용됩니다.
최신 정보. 세 번째 요점은 W3C 가 CSS에 대해 말합니다.
:hover가상 클래스는 사용자가 포인팅 장치와 요소를 지정하는 동안 적용되지만, 반드시 활성화되지 않는다. 예를 들어, 시각적 사용자 에이전트는 커서 (마우스 포인터)가 요소에 의해 생성 된 상자를 가리킬 때이 의사 클래스를 적용 할 수 있습니다.
CSS 사용 :
CSS 이전에는 HTML 문서의 거의 모든 표현 속성이 HTML 마크 업에 포함되었습니다. HTML에서 모든 글꼴 색상, 배경 스타일, 요소 정렬, 테두리 및 크기를 반복해서 명시 적으로 설명해야했습니다. CSS를 사용하면 많은 정보를 별도의 스타일 시트로 이동하여 HTML 마크 업을 훨씬 간단하게 만들 수 있습니다.
hover의사 클래스는 그 목적이있다. 나는 단지 인용했다. 편집했습니다.