“javascript : void (0)”의 의미는 무엇입니까?

<a href="javascript:void(0)" id="loginlink">login</a>

나는 그런 것들을 href여러 번 보았지만 정확히 그것이 무엇을 의미하는지 모르겠습니다.

void연산자는 주어진 표현하고 수익을 평가합니다 undefined.

void운영자는 종종 획득하기 위해 단지 이용된다 undefined통상적으로 "사용하여 원시 값을 void(0)"(동등하다 " void 0"). 이 경우 전역 변수 undefined 를 대신 사용할 수 있습니다 (기본값이 아닌 경우).

여기에 voidoperator 가 설명되어 있습니다 .

href링크를 사용 하여이 작업을 수행하려는 이유 는 일반적으로 javascript:URL이 브라우저를 해당 JavaScript 평가 결과의 일반 텍스트 버전으로 리디렉션하기 때문입니다. 그러나 결과가 undefined인 경우 브라우저는 동일한 페이지에 유지됩니다. void(0)로 평가되는 짧고 간단한 스크립트입니다 undefined.

기술 답변 외에도 javascript:void저자가 잘못하고 있음을 의미합니다.

javascript:의사 URL (*) 을 사용해야 할 이유가 없습니다 . 실제로 누구나 '북마크 링크', '새 탭에서 링크 열기'등과 같은 작업을 시도하면 혼동이나 오류가 발생할 수 있습니다. 사람들은 이제 새로운 탭 중간 클릭에 익숙해졌습니다. 링크처럼 보입니다. 새 탭에서 읽고 싶지만 실제 링크는 아닙니다. 빈 페이지 나 중간 클릭시 JS 오류와 같은 원하지 않는 결과를 제공합니다.

<a href="#">덜 나쁠 수도있는 일반적인 대안입니다. 그러나 링크를 따르고 페이지 맨 위로 스크롤하지 않도록 이벤트 핸들러 return false에서 기억해야합니다 onclick.

경우에 따라 링크를 가리키는 유용한 장소가있을 수 있습니다. 당신은 당신이 클릭 할 수있는 컨트롤이 이전 숨겨진 열어이있는 경우 예를 들어 <div id="foo">, 그것은 사용에 어떤 의미합니다 <a href="#foo">그것에 대한 링크를. 또는 자바 스크립트가 아닌 방식으로 동일한 작업을 수행하는 경우 (예 : foo를 시작으로 설정하는 'thispage.php? show = foo') 링크 할 수 있습니다.

그렇지 않으면 링크가 일부 스크립트 만 가리키는 경우 실제로는 링크가 아니므로 그렇게 표시해서는 안됩니다. 일반적인 접근 방식은 추가하는 것 onclickA를 <span>, <div>또는 <a>없이 href당신이 그것을 클릭 할 수 명확하게하기 위해 어떤 방법과 스타일을. 이것이 바로 StackOverflow가 작성한 시점입니다. 이제는 href="#"]를 사용합니다 .

이것의 단점은 span / div / bare-a를 탭하거나 공백으로 활성화 할 수 없기 때문에 키보드 컨트롤이 손실된다는 것입니다. 이것이 실제로 불리한 지의 여부는 요소가 취해야 할 행동의 종류에 달려 있습니다. 약간의 노력을 기울이면 tabIndex요소에 a 를 추가 하고 스페이스 키 누르기를 들음 으로써 키보드 상호 작용 성을 모방 할 수 있습니다. 그러나 다른 브라우저가 키보드에 다르게 반응 할 수 있기 때문에 (비 시각적 브라우저는 말할 것도없고) 실제 브라우저 동작을 100 % 재현하지는 않습니다.

링크는 아니지만 마우스 나 키보드로 정상적으로 활성화 할 수있는 요소를 원한다면 원하는 것이 있습니다 <button type="button">(또는 <input type="button">간단한 텍스트 내용도 마찬가지입니다). 원하는 경우 언제든지 CSS를 사용하여 CSS를 다시 스타일링 할 수 있으므로 버튼보다 링크처럼 보입니다. 그러나 버튼처럼 작동하므로 실제로 표시해야합니다.

(* : 사이트 제작에서 어쨌든 그것들은 북마크에 유용합니다. javascript:의사 URL은 개념적 기괴함 : 위치를 가리 키지 않고 현재 위치 내에서 활성 코드를 호출하는 로케이터입니다. 브라우저와 웹앱 모두에 문제가 있으며 Netscape에서 발명 한 적이 없습니다.)

그것은 아무것도 할 수 없다는 것을 의미합니다. 링크가 어디서나 '탐색'되지 않도록하려는 시도입니다. 그러나 올바른 방법은 아닙니다.

당신은 실제로 단지한다 return false에 onclick이벤트과 같이 :

<a href="#" onclick="return false;">hello</a>

일반적으로 링크가 'JavaScript-y'작업을 수행하는 경우 사용됩니다. AJAX 양식을 게시하거나 이미지를 바꾸는 것 등 이 경우 return이라는 함수를 만들면 false됩니다.

그러나 웹 사이트를 완전히 멋지게 만들려면 일반적으로 웹 사이트를 탐색하는 사람이 JavaScript를 실행하지 않는 경우 동일한 작업을 수행하는 링크가 포함됩니다.

<a href="backup_page_displaying_image.aspx"
   onclick="return coolImageDisplayFunction();">hello</a>

"#"과 javascript : void의 동작에는 큰 차이가 있습니다.

"javascript : void (0);"동안 "#"이 (가) 페이지의 TOP으로 스크롤됩니다. 하지 않습니다.

동적 페이지를 코딩하는 경우 매우 중요합니다. 사용자는 페이지에서 링크를 클릭하여 맨 위로 돌아 가기를 원하지 않습니다.

HTML 링크에 JavaScript 함수를 추가하는 데 널리 사용되는 방법입니다.
예를 들어 [Print]많은 웹 페이지에 표시 되는 링크는 다음과 같이 작성됩니다.

<a href="javascript:void(0)" onclick="callPrintFunction()">Print</a>

혼자서 일을 할 수있는 href동안 왜 우리는 필요 onclick합니까? 이 없을 때 사용자가 '인쇄'텍스트 위에 마우스를 놓으면 href커서가 포인터 (👆) 대신 캐럿 (ꕯ)으로 바뀝니다. 만 갖는 href온 a태그하면 하이퍼 링크로 검증한다.

의 대안 href="javascript:void(0);"은을 사용하는 것입니다 href="#". 이 대안은 사용자 브라우저에서 JavaScript를 켤 필요가 없으므로 더 호환됩니다.

당신은 항상 당신에 href가 있어야한다 의 태그를. 'undefined'를 반환하는 JavaScript 함수를 호출하면 정상적으로 작동합니다. '#'에 연결됩니다.

href가없는 Internet Explorer 6의 앵커 태그는 a:hover스타일이 적용 되지 않습니다 .

그렇습니다. 인류에 대한 끔찍하고 사소한 범죄이지만 Internet Explorer 6도 마찬가지입니다.

이게 도움이 되길 바란다.

Internet Explorer 6은 실제로 인류에 대한 주요 범죄입니다.

문자가 덜 필요하기 때문에 undefined를 확인할 때 void 0이 표시되는 경우가 있습니다.

예를 들면 다음과 같습니다.

something === undefined

vs.

something === void 0

이러한 이유로 일부 축소 방법은 undefined를 void 0으로 바꿉니다.

사용은 javascript:void(0)HTML 작성자가 단추 요소 대신 앵커 요소를 잘못 사용하고 있음을 의미합니다.

페이지를 새로 고치지 않도록 href를 "#"또는 "javascript : void (0)"으로 설정하여 의사 버튼을 만들기 위해 앵커 태그가 onclick 이벤트에서 종종 남용됩니다. 이 값은 링크를 복사 / 드래그하거나, 새 탭 / 창에서 링크를 열거 나, 책갈피를 지정하거나 JavaScript가 여전히 다운로드 중이거나 오류가 발생하거나 비활성화 된 경우 예기치 않은 동작을 유발합니다. 또한 보조 기술 (예 : 화면 판독기)에 잘못된 의미를 전달합니다. 이 경우 <button>대신 사용하는 것이 좋습니다 . 일반적으로 올바른 URL을 사용하는 탐색에는 앵커 만 사용해야합니다.

출처 : MDN 's <a>Page .

void 를 반환하는 데 사용되는 연산자입니다 undefined브라우저가 새 페이지를로드 할 수 없도록 값 .

웹 브라우저는 URL로 사용되는 모든 것을 시도하여 null을 반환하는 JavaScript 함수가 아닌 한이를로드합니다. 예를 들어 다음과 같은 링크를 클릭하면

<a href="javascript: alert('Hello World')">Click Me</a>

새 페이지를로드하지 않고 경고 메시지가 표시됩니다. alert 이는 null 값을 반환하는 함수 입니다. 즉, 브라우저가 새 페이지를로드하려고하면 null이 표시되고로드 할 것이 없습니다.

void 연산자에 대해 유의해야 할 중요한 점은 값이 필요하고 자체적으로 사용할 수 없다는 것입니다. 우리는 이것을 다음과 같이 사용해야합니다 :

<a href="javascript: void(0)">I am a useless link</a>

이 개념을 이해하려면 먼저 JavaScript의 void 연산자를 이해해야합니다.

void 연산자의 구문은 다음과 같습니다. void «expr» 과 . expr을 평가하고 undefined를 반환합니다.

void를 함수로 구현하면 다음과 같이 보입니다.

function myVoid(expr) {
    return undefined;
}

이 void 연산자에는 식의 결과를 버리는 중요한 사용법이 있습니다.

경우에 따라 식의 결과와 달리 정의되지 않은 값을 반환하는 것이 중요합니다. 그런 다음 void를 사용하여 해당 결과를 버릴 수 있습니다. 이러한 상황 중 하나는 javascript : URL과 관련이 있으며, URL은 링크에서는 피해야하지만 책갈피에 유용합니다. 해당 URL 중 하나를 방문하면 많은 브라우저가 현재 문서를 URL "content"를 평가 한 결과로 대체하지만 결과가 정의되지 않은 경우에만 해당됩니다. 따라서 현재 표시된 컨텐츠를 변경하지 않고 새 창을 열려면 다음을 수행하십시오.

javascript:void window.open("http://example.com/")

void연산자는 주어진 식을 계산 한 후 undefined를 반환합니다. 페이지를 새로 고치지 않습니다.

웹 개발자 javascript:void(0)는 a태그의 기본 동작을 방지하는 가장 쉬운 방법이기 때문에 사용 합니다 . void(*anything*)반환 undefined과는 falsy 값입니다. 그리고 falsy 값을 반환하는 것은 같다 return false에서 onclick의 이벤트 a기본 동작을 방지 태그입니다.

태그의 javascript:void(0)기본 동작을 막는 가장 간단한 방법 이라고 생각 합니다 a.

링크를 사용 가능한 표시 객체로 사용하려면 링크에 HREF 대상을 지정해야합니다.

대부분의 브라우저는 고급 자바 스크립트를

<A HREF="" 

다음과 같은 태그 :

<A href="JavaScript:var elem = document.getElementById('foo');" 

대부분의 브라우저에서 HREF 태그는 공백을 허용하지 않거나 공백을 % 20으로 변환하기 때문에 SPACE와 동등한 HEX는 JavaScript를 해석기에 전혀 쓸모 없게 만듭니다.

따라서 A HREF 태그를 사용하여 인라인 JavaScript를 실행하려면 너무 복잡하지 않은 (공백이 포함되지 않은) HREF FIRST에 유효한 값을 지정한 다음 OnClick과 같은 이벤트 속성 태그에 JavaScript를 제공해야합니다. , OnMouseOver, OnMouseOut 등

일반적인 대답은 다음과 같이하는 것입니다.

<A HREF="#" onclick="var elem = document.getElementById('foo');">Get the object</a>

이것은 잘 작동하지만 파운드 기호 / 해시 태그로 인해 페이지가 맨 위로 이동하게합니다.

A HREF 태그에 파운드 기호 / 해시 태그를 제공하는 것만으로 실제로 루트 앵커를 지정합니다. 이는 항상 기본적으로 페이지 상단에 A HREF 태그 내에 NAME 속성을 지정하여 다른 위치를 지정할 수 있습니다.

<A NAME='middleofpage'></A>

그런 다음 A HREF 태그를 변경하여 'middleofpage'로 이동하여 OnClick 이벤트에서 JavaScript를 실행할 수 있습니다.

<A HREF="#middleofpage" onclick="var elem = document.getElementById('foo');">Get the object</a>

해당 링크가 점프하는 것을 원하지 않는 많은 시간이 있으므로 두 가지 작업을 수행 할 수 있습니다.

<A HREF="#thislinkname" name='thislinkname' onclick="var elem = document.getElementById('foo');">Get the object</a>

이제 클릭하면 아무데도 가지 않지만 페이지가 현재 뷰포트에서 중심을 다시 맞출 수 있습니다. 이쁘지 않습니다. A HREF를 사용하지만 위의 작업을 수행하지 않고 인라인 자바 스크립트를 제공하는 가장 좋은 방법은 무엇입니까? 자바 스크립트 : void (0);

<A HREF="JavaScript:void(0);" onclick="var elem = document.getElementById('foo');">Get the object</a>

브라우저에 NOWHERE로 이동하도록 지시하지만 대신 유효한 JavaScript를 실행하십시오 .void (0); 공백이없고 URL로 구문 분석되지 않기 때문에 HREF 태그에서 첫 번째 함수입니다. 대신 컴파일러가 실행합니다. VOID는 매개 변수가 0으로 제공 될 때 UNDEFINED를 리턴하는 키워드로, 0을 지정하지 않고 발생하는 리턴 값을 처리하기 위해 더 이상 자원을 사용하지 않습니다 (메모리 관리 / 성능이 더 좋습니다).

다음으로 발생하는 것은 OnClick이 실행되는 것입니다. 페이지가 움직이지 않고 디스플레이 방향으로 아무 일도 일어나지 않습니다.

자바 스크립트 : URL은 제쳐두고; 여기서 void는 짧은 코드를 작성하는 데 유용 할 수 있습니다.

var error1 = false,
    error2 = false,
    error3 = false;

function error1() {

  error1 = true;
}

function myFunction() {

  // You can easily return and call a function at once, if you don't care about myFunction's return value
  if (!someCondition1)
    return error1();

  // What if you want to set a value first?
  if (!someCondition2) {
    error2 = true;
    return
  }

  // Shortest way to return and set a value at once
  if (!someCondition3)
    return void(error3 = true);

  // More code goes here
}