>  기사  >  웹 프론트엔드  >  HTML 태그의 href 및 onclick에 대한 자세한 소개

HTML 태그의 href 및 onclick에 대한 자세한 소개

黄舟
黄舟원래의
2017-07-27 13:42:171548검색

72d4ced2cc960a6bc2541984146fdaaa의 href와 onclick을 쓰곤 했는데 나중에 여러 가지 문제가 발생하고 이 문제에 주목하기 시작했습니다.

먼저 문서에서 발췌:

Javascript의 void는 표현식이 평가되지만 값을 반환하지 않음을 지정하는 연산자입니다.

void 연산자 사용 형식은 다음과 같습니다.

1. javascript:void (expression) 
2. javascript:void expression

expression은 평가할 Javascript 표준 표현식입니다. 표현식 외부의 괄호는 선택사항이지만 작성하는 것이 좋습니다. (구현 버전 Navigator 3.0)

void 연산자를 사용하여 하이퍼링크를 지정할 수 있습니다. 표현식이 평가되지만 현재 문서에는 아무것도 로드되지 않습니다.

아래 코드는 하이퍼링크를 생성하며 나중에 사용자에게는 아무 일도 일어나지 않습니다. 사용자가 링크하면 void(0)는 0으로 평가되지만 Javascript에는 영향을 미치지 않습니다.

<A HREF="javascript:void(0)">单此处什么也不会发生</A>

아래 코드는 사용자가 클릭할 때 양식을 제출하는 하이퍼링크를 생성합니다.

<A HREF="javascript:void(document.form.submit())">

여기에 양식을 제출하세요63505a6f727f70c8bd4066f3066dcb9d

다음 코드는 subgo() 함수

<a href="javascript:void(0)" onclick="subgo()">点我</a>

여기에서 javascript:void(0)는 실제로 활성화되지 않습니다. 단지 데드 링크이고 실행된 함수는 subgo()입니다.

点我与<a href="javascript:void(0)" onclick="subgo()">点我</a>区别。

사실 #에는 위치 정보가 포함되어 있습니다. 기본 앵커는 웹 페이지의 상단인 #top이고 javascript:void(0)는 아무런 정보도 없는 데드 링크만 나타냅니다. 따라서 스크립트 호출 시 void(0)를 사용하는 것이 가장 좋습니다.

href는 일반적으로 URL 주소를 가리키며, href="javascript:xxx();"와 같은 javascript도 호출할 수 있으며 문서에서는 작성을 권장합니다. 예: 97645ab94f319ea0ad8ad3c2666043a5xx5db79b134e9f6b82c0b36e0489ee08ed 그러나 이 방법은 때때로 복잡한 환경에서 이상한 문제를 야기합니다. 프로토콜을 A href 속성으로 지정하면 window.onbeforeunload 이벤트가 불필요하게 트리거될 뿐만 아니라 애니메이션 gif 이미지가 IE에서 재생을 중지하게 됩니다.

링크의 onclick 이벤트가 먼저 실행된 다음 href 속성(페이지 점프 또는 자바스크립트 의사 링크) 아래의 작업이 실행된다는 것을 알고 있습니다. onclick은 false를 반환해야 합니다. 일반적으로 TabPane의 JS 소스 코드는 다음과 같이 작성됩니다. onclick="xxx();return false;".

TabPane은 TABPANE이 닫힐 때 FALSE를 반환하지 않습니다. IFRMAE의 경우 href 실행 및 페이지 표시 문제가 발생합니다. 해결책은 TAB을 사용하여 다음 코드를 JSP에 복사하는 것입니다.

TabPane.prototype.appendTitle = function(tabpage){
  var td = $create("td");
  var strHTML = "<table class="" + TAB_STYLE_TABLE  + "" border="0" cellspacing="0" cellpadding="0"><tr>";
  strHTML +="<td><p class=""+TAB_STYLE_LEFT+""></p></td>";
  strHTML +="<td nowarp class=""+TAB_STYLE_MID+"">";
  strHTML +="<p style="white-space:nowrap;page-break-before: always;page-break-after: always;">";
  strHTML += tabpage.getTitle();
  strHTML +="</p></td>";
  if(tabpage.showCloseButton){
   strHTML +="<td nowarp class=""+TAB_STYLE_MID+"">";
   strHTML +="<a class="close" href="#" onclick="$o(\"" + this.id + "\").getTab(\"" + tabpage.id + "\").close();
return false;
">";
   if(isIE){
    strHTML +="<p></p></a>";
   }else{
    strHTML +="<p class="close"></p></a>";
   }
   strHTML +="</td>";
  }
  if(tabpage.allowReload){
   strHTML +="<td nowarp class=""+TAB_STYLE_MID+"">";
   strHTML +="<a class="reload" href="#" onclick="$o(\"" + this.id + "\").getTab(\"" + tabpage.id + "\").reload();
return false;
">";
   if(isIE){
    strHTML +="<p></p></a>";
   }else{
    strHTML +="<p class="reload"></p></a>";
   }
   strHTML +="</td>";
  }
  strHTML +="<td><p class=""+TAB_STYLE_RIGHT+""></p></p>";
  strHTML +="</td></tr></table>";
  td.className = TAB_STYLE_NOMAL + this.styleSuffix;
  td.innerHTML = strHTML;
  tabpage.__titleTD = td;
  tabpage.setTitleTD();
  tabpage.initStatus();
  this.__titleTR.insertBefore(td,this._titleTD);
  tabpage.titleWidth = td.offsetWidth;
}


위 내용은 HTML 태그의 href 및 onclick에 대한 자세한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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