Javascript - asynchrones Laden von js und DOM-Ausführungssequenz, Packen von js. (ohne Gulp und Webpack)
代言
代言 2017-06-30 09:58:30
0
2
818

Zweck:

Ich möchte die allen Seiten im Projekt gemeinsamen Ressourcen wie reset.css, jq-ui.css, jq.js usw. in ein js packen. Es kann in Zukunft als Initialisierungs-js bezeichnet werden. Neue Seiten können nur darauf verweisen.

Aktuelle Situation:

index.html

  //所有页面通用  //所有页面通用  //单独这个页面的css   //页面代码…… //页面代码……   //所有页面通用  //单独这个页面的js

Möchten Sie es ändern in:

index.html

  //只保留单独这个页面的css   //页面代码…… //页面代码……   //想要封装好通用init的js,以后可以通用  //只保留单独这个页面的js

init.js

(function(){ var reset_css = document.createElement('link'), jq_js = document.createElement('script'); //加载通用的css reset_css.href = "css/reset.css"; //加载通用的js jq_js.src = "js/jq.js"; }())

Frage:

Problem mit der Ladereihenfolge der Seitenressourcen

  1. Die reset.css muss zu Beginn geladen werden. ----Die tatsächliche Situation ist, dass es nach dem Rendern des DOM geladen wird, was nutzlos ist

  2. jq.js, da das js aller Seiten von jq abhängt, muss jq zuerst geladen werden, und dann wird das js der Seite geladen. ----Die tatsächliche Situation ist, dass die Seite js zuerst geladen wird und ein Fehler gemeldet wird.

Bitten Sie um Rat:

  1. Wenn Sie die oben gewünschten Ergebnisse erzielen möchten, wie sollten Sie es schreiben, um sicherzustellen, dass externe src- und href-Ressourcen in der gewünschten Reihenfolge angefordert werden? Dies bedeutet, dass das abhängige CSS und JS ausgeführt werden muss, bevor das JS der Seite ausgeführt wird, und dann nach dem Laden ausgeführt werden muss.

  2. Ich habe Dateiüberwachungsereignisse und Onload überprüft, aber es gibt viele gemeinsame Dinge auf meiner Seite. Wie kann ich sicherstellen, dass alle initialisierten Ressourcen geladen werden, bevor sie geladen werden?

common_file1.onload = function(){ common_file2.onload = function(){ common_file3.onload = function(){ return } return } //再去加载每个页面中的单独需要资源吗? 这样写感觉好傻 /(ㄒoㄒ)/~~ }
代言
代言

Antworte allen (2)
扔个三星炸死你

不知道你打包是采用gulp还是webpack, 可以试着引入gulp-order类似的插件

    给我你的怀抱

    我大概记得就是按照顺序打包。就好了。

      Neueste Downloads
      Mehr>
      Web-Effekte
      Quellcode der Website
      Website-Materialien
      Frontend-Vorlage
      Über uns Haftungsausschluss Sitemap
      Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!