Heim  >  Artikel  >  Web-Frontend  >  Eine Falle, die nur wenige Menschen über das href-Attribut des a-Tags in HTML kennen

Eine Falle, die nur wenige Menschen über das href-Attribut des a-Tags in HTML kennen

黄舟
黄舟Original
2017-07-27 13:39:422063Durchsuche

Aufgrund der Anforderungen des Unternehmens beschäftigt sich Xiaocai in letzter Zeit mit der App-Webentwicklung. Obwohl es nur diese beiden Versionen gibt, müssen aufgrund der Standardbrowser-Kernel immer noch Probleme mit der Browserkompatibilität berücksichtigt werden von Android und iOS sind unterschiedlich.

Lassen Sie uns zunächst über das Kompatibilitätsproblem sprechen. Angenommen, es gibt eine solche URL:

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

Hinter dieser URL steht ein Namensparameter, aber der Wert des Parameters enthält tatsächlich Leerzeichen. Es ist kein Problem, direkt mit dem Android-Browser auf einen solchen Link zuzugreifen. aber beim Zugriff über einen iOS-Browser ist dies eine falsche URL und es wird ein Fehler gemeldet!

Daher denken wir über die Codierung nach. Der Wert des Namensparameters kann mit der Methode encodeURIComponent() codiert und dann an die URL gespleißt werden (encodeURIComponent ist ein js native Methode, verwenden Sie sie direkt Das ist es).

Dann können wir Hyperlinks wie diesen verwenden:

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

Verwenden Sie die openURL-js-Methode, um zur Seite zu springen (vorausgesetzt, es gibt eine openURL-Methode, die keinen Dekodierungsvorgang erfordert). .

Dieser Code läuft normal in Android, aber wenn es um iOS geht, meldet er immer noch einen Fehler. Er ist tatsächlich codiert.

Bitte schauen Sie sich den folgenden Code an:

<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>

Es ist ersichtlich, dass: Das Attribut „böse“ href ist Wird beim Aufruf von openURL verwendet und beim Übergeben von Parametern automatisch dekodiert, während das Attribut onclick die Parameter intakt hält.

Daher empfiehlt Xiaocai dringend, das href-Attribut des a-Tags zum Aufrufen von js zu verwenden. Die Onclick-Methode ist sehr wissenschaftlich, sehr stabil und sehr korrekt. Die ursprüngliche Absicht von href ist das Springen zur URL, also nicht zum Ausführen von js verwenden. Tatsächlich besteht ein besserer Ansatz darin, Ereignisse zu binden, damit der Code einfacher zu verwalten ist und ordentlich aussieht.


Das obige ist der detaillierte Inhalt vonEine Falle, die nur wenige Menschen über das href-Attribut des a-Tags in HTML kennen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn