Heim > Web-Frontend > js-Tutorial > Perfekte Lösung für das Problem des Vorladens von InstantClick

Perfekte Lösung für das Problem des Vorladens von InstantClick

巴扎黑
Freigeben: 2017-09-13 09:32:11
Original
2028 Leute haben es durchsucht

Dieser Artikel stellt hauptsächlich die Lösung für das Problem des Vorladens von InstantClick vor. Der Herausgeber findet ihn recht gut, daher werde ich ihn jetzt mit Ihnen teilen und als Referenz geben. Folgen wir dem Editor, um einen Blick darauf zu werfen.

Während der Transformation gestern Abend konnte die Codehervorhebung nicht ausgeführt werden. Um genau zu sein, wurde sie nur einmal ausgeführt und nicht beim zweiten Mal. Also habe ich einen Artikel geschrieben, um es zu erklären, und nachdem ich die InstantClick-Dokumentation grob gelesen hatte, stellte ich fest, dass es sich hauptsächlich um ein Problem mit dem Blacklist-Bereich handelte. Nach meinem persönlichen Verständnis umfasst die Blacklist hauptsächlich zwei gängige Filtertypen: einer ist ein Tag und der andere ist js. Gemäß seinem Prinzip wird der Blacklist-Bereich nicht verarbeitet (geladen und aktualisiert gemäß dem normalen manuellen Öffnen). Diese Art der Nichtverarbeitung kann dazu führen, dass die relevanten Strukturen und js funktionieren. .

Wenn InstantClick ausgeführt wird, sehen Sie sich die Referenzanweisung an:


<script type="text/javascript" src="<?php bloginfo(&#39;template_directory&#39;); ?>/js/instantclick.min.js" data-no-instant></script>
<script data-no-instant>InstantClick.init();</script>
Nach dem Login kopieren

Anweisung filtert InstantClick selbst heraus. Dies entspricht einer normalen Aktualisierung nach der Ausführung.

Js normal laden und aktualisieren

Der data-no-instant-Parameter der Anweisung selbst bedeutet, sie nicht zu verarbeiten und diesen Teil der Struktur normal zu aktualisieren. Wenn Sie also möchten, dass andere JS unter InstantClick funktionieren, müssen Sie den JS selbst aktualisieren. Sie können den Code in instantclick.min.js schreiben oder den Parameter data-no-instant verwenden, um ihn unabhängig zu referenzieren. Wenn Sie kein eigenes js in instantclick.min.js schreiben, müssen Sie dessen vier Parameter verwenden, um es neu zu laden: http://instantclick.io/scripts


<script data-no-instant>
InstantClick.on(&#39;change&#39;, function() {
// 回调
});
InstantClick.init();
</script>
Nach dem Login kopieren

a-Tag

InstantClick verarbeitet keine in neuen Fenstern geöffneten a-Tags und verfügt außerdem über data-no-instant Das a-Tag, das unter dem Parameter eingeschlossen ist Tag wird nicht verarbeitet. Beispiel: <p data-no-instant>这部分会按正常情况刷新</p>。

Abschließende Zusammenfassung: Das Attribut data-no-instant wird verwendet, um zu verhindern, dass Instantclick das Element wiederholt lädt, wenn die Seite wechselt (d. h. normal aktualisiert wird). Es kann in Skript- und Style-Tags verwendet und auch in a-Tags platziert werden, was bedeutet, dass der Link auf normale Weise ohne Instantclick-Beschleunigung geöffnet wird, aber für p-Tags, die bekannt sein müssen, ist es nutzlos.

Sobald Sie die beiden oben genannten Punkte verstanden haben, dachten wir, es sei Ajax und es wurde vom gesamten Körper angefordert. Mit anderen Worten: Es ist auch möglich, den unbearbeiteten Teil außerhalb des Body-Tags zu platzieren.

Es ist erwähnenswert, dass mir persönlich die Cache-Vorwärts- und Rückwärtsfunktion gefällt, die sehr schnell ist.

Das obige ist der detaillierte Inhalt vonPerfekte Lösung für das Problem des Vorladens von InstantClick. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage