HTML에서 a 태그의 href 속성에 대해 아는 사람은 거의 없습니다.

회사의 요구로 인해 Xiaocai는 최근 앱 웹 개발에 참여하고 있습니다. 현재는 iOS와 Android 버전만 있지만 Android의 기본 브라우저 커널 때문에 브라우저 호환성 문제는 여전히 고려되어야 합니다. 그리고 ios는 다릅니다.

먼저 호환성 문제에 대해 이야기해 보겠습니다. 다음과 같은 URL이 있다고 가정해 보겠습니다.

          http://www.kpdown.com/search?name=Ben Nadel

이 URL 뒤에는 name 매개변수가 있지만 실제로 매개변수 값에 공백이 포함되어 있습니다. Android 브라우저에서는 이러한 링크에 직접 액세스할 수 있지만 iOS에서는 액세스할 수 있습니다. 브라우저, 이는 잘못된 URL이며 오류가 보고됩니다!

따라서 인코딩을 생각해 보겠습니다. name 매개변수의 값은 encodeURIComponent() 메서드를 사용하여 인코딩한 다음 URL에 접합할 수 있습니다. 이는 안전합니다(encodeURIComponent는 js 기본 메서드이므로 사용할 수 있습니다. 직접적으로).

그런 다음 다음과 같은 하이퍼링크를 사용할 수 있습니다.

           <a href="javascript:openURL(&#39;http://www.kpdown.com/search?name=Ben%20Nadel&#39;);" >查询</a>

openURL js 메서드를 사용하여 페이지로 이동합니다(디코딩 작업을 포함하지 않는 openURL 메서드가 있다고 가정).

이 코드는 Android에서는 정상적으로 실행되지만 iOS에서는 여전히 오류가 보고됩니다. 왜 여전히 작동하지 않나요?

다음 코드를 살펴보세요.

<a href="javascript:openURL(&#39;http://www.kpdown.com/search?name=Ben%20Nadel&#39;);">测试href</a>
<a href="javascript:;" onclick="javascript:openURL(&#39;http://www.kpdown.com/search?name=Ben%20Nadel&#39;);">测试onclick</a>

<script>
  function openURL(url){
    /*
    * 测试href --print--> http://www.kpdown.com/search?name=Ben Nadel
    * 测试onclick --print--> http://www.kpdown.com/search?name=Ben%20Nadel
    */
    console.log(url);
  }
</script>

매개변수를 전달하기 위해 openURL을 호출할 때 "evil"의 href 속성이 자동으로 디코딩되는 반면 onclick 속성은 매개변수를 유지하는 것을 볼 수 있습니다. 손대지 않은.

따라서 Xiaocai는 a 태그의 href 속성을 사용하여 js를 호출하는 것을 강력히 권장하지 않습니다. onclick 방법은 매우 과학적이고 매우 안정적이며 매우 정확합니다. href의 원래 의도는 URL로 이동하는 것입니다. js를 실행하는 데 사용하지 마십시오. 실제로 더 나은 접근 방식은 이벤트를 바인딩하여 코드를 더 쉽게 관리하고 깔끔하게 보이도록 하는 것입니다.

위 내용은 HTML에서 a 태그의 href 속성에 대해 아는 사람은 거의 없습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!