Ein vollständiges Beispiel
Ich habe so viel darüber gesagt, und die Wissenspunkte sind relativ verstreut. Am Ende plane ich, ein komplettes SEAJS -Beispiel zu verwenden, um diese Wissenspunkte zusammenzuschließen, damit Ihre Freunde zusammenfassen und überprüfen können. Dieses Beispiel enthält die folgenden Dateien:
1.Index.html - Hauptseite.
2.Sea.js-Seajs Skript.
3.Init.js-Init-Modul, Eintragsmodul, auf Daten, jQuery und Stil stützen. Geladen von der Hauptseite.
4.Data.js-data-Modul, reines JSON-Datenmodul, geladen von init.
5.JQuery.js-JQuery-Modul, modulare Kapselung der JQuery-Bibliothek, geladen von init.
6.Style.css-CSS Style Sheet, geladen von Init als Stilmodul.
7. Die Codes von Sea.js und jQuery.js gehören zum Bibliothekscode, daher werde ich nicht auf Details eingehen.
HTML:
Kopieren Sie den Code wie folgt: <! DocType html>
<html lang = "zh-cn">
<kopf>
<meta charset = "utf-8">
<title> </title>
</head>
<body>
<div id = "content">
<p> </p>
<p> <a href = "#"> blog </a> </p>
</div>
<script src = "./ sea.js" data-main = "./ init"> </script>
</body>
</html>
JavaScript:
Die Codekopie lautet wie folgt:
//init.js
Definieren Sie (Funktion (erfordern, exportieren, modul) {
var $ = fordert ('./ JQuery');
var data = required ('./ data');
var CSS = Request ('./ style.css');
$ ('. Autor'). HTML (Daten.Author);
$ ('. Blog'). attr ('href', data.blog);
});
//data.js
definieren({
Autor: 'Zhangyang',
Blog: 'http://blog.codinglabs.org'
});
CSS:
Die Codekopie lautet wie folgt:
.Author {Farbe: rot; Schriftgröße: 10pt;}
.blog {Schriftgröße: 10pt;}
Der Betriebseffekt ist wie folgt: