Beim Laden des Pfads inlaydate.js ist ein Fehler aufgetreten

Ich glaube, jeder kennt das Datums- und Uhrzeitauswahl-Plug-in „laydate.js“. Dieser Artikel stellt Ihnen hauptsächlich die relevanten Informationen vor, wie Sie das Problem des Pfadfehlers beim Laden von „laydate.css“ lösen können Der Artikel stellt es anhand des Beispielcodes sehr gut vor. Er ist detailliert und bietet einen gewissen Referenzwert für das Lernen oder Arbeiten. Freunde, die ihn benötigen, können einen Blick darauf werfen.

Vorwort

laydate.js ist ein Datumssteuerungs- und Zeit-Plug-in, das zur Javascript-Reihe gehört und mit IE6 kompatibel ist und weitere wichtige Browser. Nachdem Laydate.js von Xianxin stark umgeschrieben wurde, wurde es immer leistungsfähiger und flexibler in der Verwendung, aber in einem Projekt, das auf Angular+ocLazyLoad basierte, ging etwas schief.

Es wurde ein Problem gefunden

laydate.js wird durch asynchrones Laden von ocLazyLoad eingeführt. Daher kann die Datei „laydate.css“ nicht geladen werden. Ich habe einen Blick darauf geworfen, dass der Pfad falsch war, also habe ich den Code geöffnet und festgestellt, dass er so geschrieben war:

getPath:function(){
 var e=document.scripts,
 t=e[e.length-1],
 n=t.src;
 if(!t.getAttribute("merge"))
 return n.substring(0,n.lastIndexOf("/")+1)
}()

Zuerst muss der Pfad zu „laydate.js“ ermittelt und dann der Abschnitt „laydate“ hinzugefügt werden. css, um es schließlich in einen vollständigen Pfad zu integrieren.

Die vom Autor verwendete Idee, den Pfad vonlaydate.js zu erhalten, ist: Da der JS-Code zur Bestimmung des Pfads im Allgemeinen direkt in der JS-Datei und nicht in der Funktion platziert wird, werden die darin enthaltenen Anweisungen angezeigt Wird sofort ausgeführt, wenn die JS-Datei geladen wird, und die Anzahl der JS-Dateien, die beim Ausführen dieser Anweisung erhalten werden, beträgt genau e.length-1. Da die JS-Dateien hinter der Seite noch nicht geladen wurden, beträgt die Anzahl der dort erhaltenen JS-Dateien nicht die Anzahl aller js-Dateien auf der Seite. Auf diese Weise ist es nicht erforderlich, den Pfad zum Abrufen der Datei zu durchlaufen, und der Dateiname ist für die Dateibeurteilung nicht erforderlich, wodurch die Beurteilung genauer wird (e.length-1 ist immer die Datei selbst).

Diese Methode weist jedoch Mängel auf. Es ist jedoch kein Problem, sie direkt mithilfe von Skript-Tags in die HTML-Seite einzuführen. Wenn der Pfad jedoch durch document.write("91f2bd488afe105e35022aa7562b416b</script") oder document.createElement("script") dynamisches Laden oder asynchrones Laden erhalten wird last js Der Pfad der Datei, nicht der Pfad der aktuellen j-Datei.

Dann fiel mir document.currentScript ein, was in einem Schritt erledigt werden kann, aber es gibt bestimmte Kompatibilitätsprobleme.

var curSrc = document.currentScript.src;
return curSrc.substring(0,curSrc.lastIndexOf("/")+1);

Am Ende habe ich die folgende einfache und grobe Methode verwendet:

getPath:function(){
 var e=document.scripts, n;
 for(var i=e.length;i>0;i--){
 if(e[i-1].src.indexOf("laydate.js")>-1){
 n=e[i-1].src.substring(0,e[i-1].src.lastIndexOf("/")+1);
 }
 }
 return n;
}()

Die Idee davon Die Methode ist sehr klar. Rufen Sie einfach das src-Attribut der referenzierten Datei aus dem Dateinamen ab und beurteilen und fangen Sie es ab. Diese Methode hat jedoch die folgenden zwei Nachteile:

1. Sie muss alle js-Dateien auf der Seite durchlaufen, was manchmal ineffizient sein kann. (Auf meiner Seite gibt es nicht viele JS-Dateien, haha)

2. Wenn sich JS-Dateien mit demselben Namen in verschiedenen Verzeichnissen auf der Seite befinden, ist die Beurteilung möglicherweise falsch.

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

Asynchrone Update-Warteschlange über nextTick() in Vuejs implementieren

Angular CLI-Installationsanleitung

So implementieren Sie Toast mit ReactNative

So extrahieren Sie allgemeine Module mit CommonsChunkPlugin

Das obige ist der detaillierte Inhalt vonBeim Laden des Pfads inlaydate.js ist ein Fehler aufgetreten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!