JavaScript-Lernerfahrung

1. Vorwort:

Ich habe das Little Red Book (JavaScript Advanced Programming) vor einiger Zeit gelesen, hatte aber nicht vor, es zu lesen, und habe mir nach dem Lesen keine detaillierten Notizen gemacht Ich fühlte mich ein wenig leer und hatte das Gefühl, dass etwas nicht stimmte, und ich habe keinen tiefen Eindruck davon, dass ich nicht einmal lernen kann, wie man Front-End mit JS macht. Das Backend hat js gelernt, Sie entscheiden, ob Sie sterben oder nicht.

Also las ich es, las es noch einmal und beschloss, darüber zu bloggen, um meinen Eindruck zu verstärken und Lesenotizen für zukünftige Referenzen und Diskussionen zu machen.

Warme Erinnerung: Notizen sind subjektiv, konzentrieren Sie sich also auf die Aufzeichnung von Wissen.

2. Geschichte von JavaScript

• Ursprung: Man sagt, dass Netscape 1995, am Ende des letzten Jahrhunderts, gegründet wurde startete den Navigator-Browser. Das Unternehmen strebt nicht nur nach statischem HTML, sondern auch nach dynamischen Effekten. Sie möchten auch nicht immer erst im Backend wissen, ob die Formulareingabe zulässig ist oder nicht Wir haben minutenlang gewartet, und jetzt warten wir zehn Sekunden, ohne es ausschalten zu wollen, während wir uns über eine kaputte Website beschweren.

• Hands on: Wenn Sie ein Ziel haben, tun Sie es. Es gibt viele großartige Leute bei Netscape, die JavaScript in 10 Tagen entwickelt haben Als es zum ersten Mal herauskam, hieß es LiveScript, aber um von der Popularität des beliebten Star-Java zu profitieren, wurde es in JavaScript geändert, sodass sie tatsächlich nichts miteinander zu tun haben.

• Wettbewerb: Als Microsoft sah, dass Netscape nicht gut war und mein IE kurz vor dem Tod stand, hatte ich auch das Gefühl Dieses JS hatte eine glänzende Zukunft, also habe ich eine JavaScript-Implementierung namens JScript erstellt.

• Standards: Der js-Wettbewerb zwischen Netscape und Microsoft hat zu Versionsinkonsistenzen geführt. Aufgrund von Bedenken in der Branche wurde die Standardisierung von JavaScript auf die Tagesordnung gesetzt. Die ECMA-Organisation machte sich daran und entwickelte schließlich 1997 ECMAScript als Standard. Hier können ECMAscript und JavaScript als dasselbe angesehen werden

3. ECMAScript

ECMAScript (im Folgenden als ES bezeichnet) wird durch ECMA-262 und ES formuliert Es geht hauptsächlich um Sprache. Die Grundlage der Grammatik ist die Existenz eines Standards. Wenn Sie darauf bestehen, zwischen ES und JS zu unterscheiden, ist ES der grundlegende Standard der Sprache und JS ist die auf der Grundlage dieses Standards implementierte Sprache.

Über ES-Versionen: ES hat seit seiner Formulierung im Jahr 1997 viele Versionen durchlaufen. Die vorherigen Versionen waren allesamt geringfügige Änderungen. Wichtige Versionen:

• ES3, die dritte Version, ist die erste echte Modifikation des Standards

• 2009 ES5 wird derzeit unterstützt von alle wichtigen gängigen Browser

• ES6, das 2015 veröffentlicht wurde, ist ebenfalls populär geworden.

• Nach 2015 werden jedes Jahr Versionen veröffentlicht, Browser können dies jedoch noch nicht unterstützen.

4. JavaScript-Implementierung

Javascript besteht aus drei Teilen:

1. Der Kernteil ist die grammatikalische Basis von js Wir werden später weiter über seine Syntax schreiben.
2.DOM (Text Object Model): Anwendungsprogrammierschnittstelle zum Betrieb von HTML-Dokumenten. Über DOM:

• Das Aufkommen von DOM ermöglicht die Implementierung von dynamischem HTML (DHTML), das das Erscheinungsbild und den Inhalt von Webseiten ändern kann, ohne die Seite neu laden zu müssen.

• Durch DOM verursachte Probleme: Vor allem in Bezug auf die Kompatibilität haben Netscape und Microsoft ihre eigenen Meinungen, was zu einer Browser-Inkompatibilität führt. Dieses Problem wurde nicht gelöst.

• DOM-Ebenen: DOM1, DOM2, DOM3. Die Ebenen hier entsprechen den DOM-Versionen, was bedeutet, dass DOM ständig verbessert wird. Jetzt ist das Neueste DOM3

3.BOM (Browsermodell): Verwenden Sie BOM, um andere Teile als die vom Browser angezeigte Seite zu steuern

5. JavaScript-Nutzung:

(1) Tag-Attribute: Der Schlüssel zur Verwendung von js in Webseiten ist die Verwendung des <script>-Tags, das 6 Attribute hat:

1. async: Optional, anzeigend Das Skript wird sofort heruntergeladen, andere Vorgänge auf der Seite werden jedoch nicht beeinträchtigt. Das heißt, asynchrone Skripte gelten nur für externe Skriptdateien.

2. defer: Optional, was angibt, dass das Skript verzögert werden kann, bis das Dokument vollständig analysiert und angezeigt wird. Das heißt, verzögerte Skripte eignen sich nur für externe Skriptdateien.

3. src: Optional, gibt eine externe Datei an, die den auszuführenden Code enthält.

4. Typ: Standardtext/Javascript. js wird standardmäßig ausgeführt und muss nicht angegeben werden.

5. Zeichensatz: Optional, gibt den Zeichensatz des über das src-Attribut angegebenen Codes an. Die meisten Browser ignorieren seinen Wert und werden nur von wenigen verwendet.

6. Sprache: veraltet
   Häufig verwendet werden die Top 4

(2) Verwendung: Verwendung <script >: Es gibt zwei Operationen :

1. Schreiben Sie den Code direkt in das Tag, dh betten Sie den Code in den HTML-Code ein. Diese Methode wird nicht empfohlen. Zum Beispiel:

<script>
 function helloWorld(){
    alert("hello world!");
 }
 helloWorld();</script>

2. Eine andere Möglichkeit, externe Dateien über das src-Attribut einzuführen.

<script src="js/hello.js"></script>

Verwenden Sie so oft wie möglich externe Referenz-JS-Dateien. Vorteile:

• Wartbarkeit: Eingebetteter Code in HTML, schwierig Aufgrund der schlechten Lesbarkeit ist die Wartung in einer separaten JS-Datei viel einfacher.

• 可缓存：浏览器可以根据具体的设置缓存链接的所用外部js文件

• 适应未来：通过外部文件来包含js无须对XHML的特别处理和注释hack。HTML和XHTML的包含文件的语法相同。

特别注意：<script>在使用了src属性后，不要在内嵌代码，此时的内嵌的代码不会被执行。只会执行src对应文件的代码。

(3)位置：关于<script> 在HTML文档中的位置：

在HTML4中规定<script> 标签可以放在 <head>和<body> 标签内。
由于浏览器解析HTML文档是由上到下，且在遇到<script> 标签后会先解析和执行js代码，并中断HTML的加载，所以放在<head> 标签中是会使得HTML文档可视内容中断加载。
画重点:所以<script> 标签的位置首考虑放在<body> 标签底部。例如：

<html>
    <head>
       <title>hello js</title>
    </head>
    <body>
        <p>hello js!</p>
        <!-- js文件放在body底部 -->
        <script src="example.js"></script>
    </body></html>

六、JavaScript的平稳退化方案

什么是平稳退化：就是有些浏览器不支持js，当然现在几乎没有浏览器这么菜啦，还有就是js功能被禁用。这时就需要没有js的情况下你的网页怎么友好一点交互，不会搞得太难看，太尴尬。
使用<noscript> 标签，应用场景：

• 浏览器不支持JavaScript

• 浏览器支持脚本，但脚本被禁止了

例子：当浏览器不支持js或禁用js时就会显示出noscript标签中的内容，若浏览器能执行js则noscript就被隐藏。

<html>
    <head>
        <script src="example.js"></script>
    </head>
    <body>
        <noscript>
         <p>本页面需要浏览器支持JavaScript</p>
        </noscript>
    </body></html>

Das obige ist der detaillierte Inhalt vonJavaScript-Lernerfahrung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!