>  기사  >  웹 프론트엔드  >  JavaScript의 우아한 저하에 대한 간략한 소개

JavaScript의 우아한 저하에 대한 간략한 소개

黄舟
黄舟원래의
2017-07-24 15:55:201284검색

일명 원활한 저하란 브라우저가 JavaScript를 지원하지 않거나 JavaScript가 비활성화된 경우에도 방문자가 웹페이지를 원활하게 탐색할 수 있다는 것을 의미합니다. 다음은 js의 원활한 저하에 대한 간략한 소개입니다. see

일명 원활한 저하란 브라우저가 JavaScript를 지원하지 않거나 JavaScript가 비활성화된 경우에도 방문자가 웹페이지를 원활하게 탐색할 수 있음을 의미합니다. 즉, 일부 기능을 사용할 수 없더라도 기본 작업은 여전히 ​​원활하게 완료될 수 있습니다.

여기서는 새 창에서 링크 열기를 예로 사용합니다. js에서 새 창을 여는 방법을 알고 있습니다.


window.open(url,name,features)

여기서 url은 열려는 웹 페이지의 URL 주소, 이름입니다. 는 새 창의 이름이고 마지막 기능은 일련의 매개변수입니다.

좋아, 이제 간단한 함수를 작성하세요:


function openwindow(winUrl){ 
window.open(winUrl,"new window","width = 320 , height = 480") 
}

그런 다음 의사 프로토콜을 사용하여 함수를 호출할 수 있습니다:


<a href = "javascript:openwindow(&#39;http://www.google.com&#39;);">google</a>

이런 방식으로 "JavaScript:" 의사 프로토콜을 지원할 수 있습니다. JavaScript를 지원하지 않는 브라우저는 링크를 열려고 시도하지만 실패하지만 JavaScript가 비활성화된 브라우저는 아무 작업도 수행하지 않습니다. onclick을 사용하려면:

<a href = "#" onclick = "openwindow(&#39;http://www.google.com&#39;);return false;">google</a>

여기에서 "#"은 빈 링크를 나타냅니다. return false를 추가하면 3499910bf9dac5ae3c52d5ede7383485 태그가 href에서 지정한 링크로 이동하지 않습니다. 그러나 JavaScript가 비활성화된 브라우저에서는 여전히 열 수 없습니다.

이 문제를 어떻게 해결할 수 있을까요? 사실 다음만 필요합니다:

<a href = "http://www.google.com" onclick = "openwindow(http://www.google.com);return false;">google</a>

또는:

<a href = "http://www.google.com" onclick = "openwindow(this.href);return false;">google</a>

onclick을 사용하여 JavaScript 기능을 실행하지만 href에 URL도 입력합니다. 속성이므로 JavaScript가 비활성화된 브라우저를 사용하는 경우 새 창을 열거나 새 창에서 연결을 열 수는 없지만 최소한 대상 웹 페이지(현재 페이지)로 이동할 수는 있습니다. Smooth Degradation을 사용해야 하는 이유에 대해 이야기하면 다음과 같은 생각이 들 수 있습니다. JavaScript를 비활성화했거나 지원하지 않는 브라우저가 웹 사이트에 원활하게 액세스하도록 허용하는 것이 그렇게 중요합니까? 결국 JavaScript를 지원하지 않는 사용자는 거의 없어야 합니까? 또는 항상 JavaScript 기능을 비활성화하십시오.

그런 사용자가 거의 없다는 것은 사실이지만 이는 매우 중요합니다.

이 사용자는 자동화된 프로그램인 검색 로봇일 수 있습니다. 다양한 웹 페이지를 탐색하는 목적은 단지 검색 엔진의 데이터베이스에 추가하는 것입니다. 검색 엔진에도 유사한 프로그램이 있지만 대부분의 검색 로봇은 JavaScript 코드를 이해하지 못하므로 웹 페이지가 원활하게 저하되지 않으면 검색 엔진 순위에 큰 영향을 미칩니다.

요약

위 내용은 JavaScript의 우아한 저하에 대한 간략한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.