JavaScriptの学習経験
1. 前書き:
私は少し前に Little Red Book (Advanced Programming with JavaScript) を読みましたが、読むつもりはなく、詳細なメモも取っていませんでした。何もかもが空っぽで、何かが間違っていると感じました。うわー、フロントエンドの JS 開発者ですらフロントエンドの使い方を学べないことにイライラしています。バックエンドは js を学習しました。死ぬかどうかはあなたが決めます。
そこで、私はそれを読んで、もう一度読んで、印象を高め、将来の参照と議論のために読書メモを作成するために、それについてブログに書くことにしました。
暖かいリマインダー: メモ内の言葉は主観的なものであるため、知識は強調して記録する必要があります。
2. JavaScript の歴史
起源: 前世紀末の 1995 年に Netscape が Navigator ブラウザを起動したと言われています。同社は、静的な HTML だけでなく、特にフォーム入力が正当であるかどうかをバックエンドが知るまでフォームの検証を処理できるようにしたいと考えています。時代は一度に数分待っていましたが、今ではウェブサイトが壊れていると文句を言いながら、オフにすることもせずに 10 秒ほど待っています。
実践: 目標があるなら、それを実行してください。Brendan Eich は 10 日間で JavaScript を作成しました (最初に公開されたときは LiveScript と呼ばれていました)。人気のスターに追いつくために Java の人気は JavaScript に変更されたため、実際には両者は何の関係もありません。
競合: Netscape が js を持っているのを見て、Microsoft はこれではダメだと感じ、私の IE は殺されるだろうと感じました。同時に、js には明るい未来があるとも感じたので、JavaScript を作成しました。 JScriptと呼ばれる実装。
標準: Netscape と Microsoft の間の競争から生まれた js はバージョンの不一致を引き起こしており、業界の懸念により JavaScript の標準化が議題に上っています。 ECMA 組織はこれを実現し、1997 年に標準として ECMAScript を考案しました。ここでは、ECMAscript と JavaScript は同じものを表現していると見ることができます
3. ECMAScript
ECMAScript (以下、ES) は、主に言語の文法的基礎であり、標準です。 ES と JS を区別する場合、ES は基本的な言語規格であり、JS はこの規格に基づいて実装された言語です。
ES のバージョンについて: ES は 1997 年に策定されて以来、多くのバージョンを経てきました。以前のバージョンはすべて軽微な変更でした。重要なバージョン: 3 番目のバージョンである
4. JavaScript の実装 javascript は 3 つの部分で構成されています: 1. ECMAScript: コア部分は js の文法の基礎であり、その文法については後ほど書き続けます。
- ES3 は、標準に対する最初の実際の変更です
- 2009 ES5 は現在、すべての主要な人気ブラウザでサポートされています
- 2015 ES6 の公開も一般的になってきています。
- 2015年以降は毎年バージョンがリリースされますが、ブラウザはまだ対応できておりません。
2.DOM (Text Object Model): HTML ドキュメントを操作するためのアプリケーション プログラミング インターフェイス。 DOM について:
- DOM の出現により、ページをリロードせずに Web ページの外観とコンテンツを変更できる動的 HTML (DHTML) の実装が可能になりました。
- DOM によって引き起こされる問題: 主に互換性に関して、Netscape と Microsoft は独自の意見を持っており、その結果ブラウザーの非互換性が生じます。この問題はまだ解決されていません。W3C は、DOM レベル: DOM1、DOM2、DOM3 の計画を開始しました。これは、DOM が常に改良されていることを意味します。
3.BOM（ブラウザモデル）：ブラウザで表示するページ以外の部分をBOMで制御します
5. JavaScriptの使い方： -
(1)タグ属性：Webページでjsを使うポイントは
を使うことです><script> タグ。これには 6 つの属性があります。
<script>标签，其有6个属性：
async：可选，表示立即下载脚本，但不妨碍页面中的其他操作。也就是异步脚本，只适用于外部脚本文件。
defer：可选，表示脚本可以延迟到文档完全被解析和显示后在执行。也就是延迟脚本，只适合与外部脚本文件。
src：可选，表示包含要执行代码的外部文件。
type：默认text/Javascript。默认执行js，可以不用指定。
charset：可选，表示通过src属性指定代码的字符集，大多数浏览器会忽略它的值，很少人使用。
language：已废弃
常用就前4个
(2)使用：使用<script >
src: オプション。実行されるコードを含む外部ファイルを示します。
charset: src 属性で指定されたコードの文字セットを示すオプション。ほとんどのブラウザーはその値を無視し、使用する人はほとんどいません。
- 言語: 廃止されました
- 最初の 4 つは一般的に使用されます🎜(2) 使用法:
<script >を使用します: 2 つの操作があります: 🎜🎜1.タグ内にコードを記述すること、つまり HTML にコードを埋め込むことはお勧めできません。例: 🎜🎜🎜🎜🎜2. src 属性を通じて外部ファイルを導入する別の方法。 🎜🎜🎜🎜<script> function helloWorld(){ alert("hello world!"); } helloWorld();</script>ログイン後にコピー🎜 できる限り外部参照 js ファイルを使用する 利点: 🎜🎜🎜🎜 保守性: HTML に埋め込まれたコードは保守が難しく、可読性が低いため、別の js ファイルで保守するのがはるかに簡単になります。 🎜<script src="js/hello.js"></script>
ログイン後にコピー 可缓存：浏览器可以根据具体的设置缓存链接的所用外部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>以上がJavaScriptの学習経験の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7677
15
1393
52
1207
24
91
11
推奨: 優れた JS オープンソースの顔検出および認識プロジェクト
Apr 03, 2024 am 11:55 AM
顔の検出および認識テクノロジーは、すでに比較的成熟しており、広く使用されているテクノロジーです。現在、最も広く使用されているインターネット アプリケーション言語は JS ですが、Web フロントエンドでの顔検出と認識の実装には、バックエンドの顔認識と比較して利点と欠点があります。利点としては、ネットワーク インタラクションの削減とリアルタイム認識により、ユーザーの待ち時間が大幅に短縮され、ユーザー エクスペリエンスが向上することが挙げられます。欠点としては、モデル サイズによって制限されるため、精度も制限されることが挙げられます。 js を使用して Web 上に顔検出を実装するにはどうすればよいですか? Web 上で顔認識を実装するには、JavaScript、HTML、CSS、WebRTC など、関連するプログラミング言語とテクノロジに精通している必要があります。同時に、関連するコンピューター ビジョンと人工知能テクノロジーを習得する必要もあります。 Web 側の設計により、次の点に注意してください。
C言語の魅力に迫る ～プログラマーの可能性を引き出す～
Feb 24, 2024 pm 11:21 PM
C言語学習の魅力：プログラマーの可能性を引き出す テクノロジーの発展に伴い、コンピュータプログラミングは大きな注目を集めている分野です。数あるプログラミング言語の中でもC言語は常にプログラマーに愛されています。そのシンプルさ、効率性、幅広い用途により、C 言語の学習は、多くの人にとってプログラミングの分野に入る最初のステップとなっています。この記事では、C言語を学ぶ魅力と、C言語を学ぶことでプログラマーの可能性を引き出す方法について解説します。 C言語学習の魅力は、まずその簡単さにあります。他のプログラミング言語と比較すると、C言語は
Wordでルート番号を入力する方法を一緒に学びましょう
Mar 19, 2024 pm 08:52 PM
Word でテキスト コンテンツを編集するときに、数式記号の入力が必要になる場合があります。 Word でルート番号を入力する方法を知らない人もいるので、Xiaomian は私に、Word でルート番号を入力する方法のチュートリアルを友達と共有するように頼みました。それが私の友達に役立つことを願っています。まず、コンピュータで Word ソフトウェアを開き、編集するファイルを開き、ルート記号を挿入する必要がある場所にカーソルを移動します。下の図の例を参照してください。 2. [挿入]を選択し、記号内の[数式]を選択します。下の図の赤丸で示すように: 3. 次に、下の[新しい数式を挿入]を選択します。以下の図の赤丸で示すように: 4. [根号式]を選択し、適切な根号を選択します。下の図の赤丸で示したように、
Pygame 入門: 包括的なインストールと構成のチュートリアル
Feb 19, 2024 pm 10:10 PM
Pygame をゼロから学ぶ: 完全なインストールと構成チュートリアル、特定のコード例が必要 はじめに: Pygame は、Python プログラミング言語を使用して開発されたオープン ソースのゲーム開発ライブラリであり、豊富な機能とツールを提供し、開発者はさまざまなタイプのゲームを簡単に作成できますゲームの。この記事は、Pygame をゼロから学習するのに役立ち、完全なインストールと構成のチュートリアルと、すぐに始めるための具体的なコード例を提供します。パート1：最初にPythonとPygameをインストールして、確認してください
jsとvueの関係
Mar 11, 2024 pm 05:21 PM
js と vue の関係: 1. Web 開発の基礎としての JS、2. フロントエンド フレームワークとしての Vue.js の台頭、3. JS と Vue の補完関係、4. JS と Vue の実用化ビュー。
Go言語のmain関数をゼロから学ぶ
Mar 27, 2024 pm 05:03 PM
タイトル: Go言語のmain関数をゼロから学ぶ Go言語はシンプルで効率的なプログラミング言語として開発者に好まれています。 Go 言語では、main 関数はエントリ関数であり、すべての Go プログラムにはプログラムのエントリ ポイントとして main 関数が含まれている必要があります。この記事ではGo言語のmain関数をゼロから学ぶ方法と具体的なコード例を紹介します。 1. まず、Go 言語開発環境をインストールする必要があります。公式ウェブサイト (https://golang.org) にアクセスできます。
現在のページを更新する js メソッド
Jan 24, 2024 pm 03:58 PM
現在のページを更新する js メソッド: 1. location.reload(); 2. location.href; 3. location.assign(); 4. window.location。詳細な紹介: 1. location.reload()、location.reload() メソッドを使用して現在のページを再読み込みします; 2. location.href、location.href 属性などを設定することで現在のページを更新できます。
JS の __proto__ とプロトタイプの違い
Feb 19, 2024 pm 01:38 PM
__proto__ とprototypeはJSのプロトタイプに関連する2つの属性で、機能が少し異なります。この記事では、2 つの違いを詳しく紹介して比較し、対応するコード例を示します。まず、それらが何を意味し、何に使用されるのかを理解しましょう。 proto__proto__ は、オブジェクトのプロトタイプを指すオブジェクトの組み込みプロパティです。カスタム オブジェクト、組み込みオブジェクト、関数オブジェクトなど、すべてのオブジェクトには __proto__ 属性があります。 __proto__属による
