【JavaScript学習】js構文の基礎-jsチュートリアル-php.cn

この記事はJavaScriptの文法を体系的にまとめたもので、書籍を読む必要もありません。非常に散らばっているので、読むのはもったいないです。時間がかかっても構いませんので、思い出に残るように保存しておいてください。また、私の知識を共有することが私のモチベーションです。みんな。

1-1 JavaScript の学習の出発点は、Web ページを処理することです。まず、簡単な操作に DOM を使用する方法を学びましょう。

我是第一段文字

我是第二段文字

document.write("hello"); # 输出文本 document.getElementById("p1").style.color="blue"; # 第一段文字变蓝色了 ログイン後にコピー 1-2 内部参照

1-3 外部参照

1-4 一般 配置するWeb ページの head または body 部分:

部分に配置します

最も一般的な方法は、ページの head 部分に 要素を配置することです。先頭部分を解析するときにコードを解析し、ページの残りの部分を解析します。

それを セクションに配置します

Web ページ がこのステートメントを読み取ると、JavaScript コードが実行されます 。関数がイベント呼び出しを通じて実行される場合、場所は必要ありません。

1-5 JavaScript ステートメントはブラウザーに送信されるコマンドです。

1-6 コメント // または /* */

1-7 var 変数名は大文字と小文字が区別されます

1-8 if ステートメント

if(条件) 注意：没有分号哦。 { 条件成立时执行的代码 } else { 条件不成立时执行的代码 } ログイン後にコピー 1-9 関数

function add2(){ var sum = 3 + 2; alert(sum); } ログイン後にコピー Call: add2 ()

1-10 Stringメソッド +

2-2 alert

ダイアログボックスの「OK」ボタンをクリックするまでは、他の操作を実行できません。

メッセージ ダイアログ ボックスは、プログラムのデバッグによく使用されます。

alert 出力コンテンツ。document.write と同様の文字列または変数にすることができます。

2-3 confirm

メッセージダイアログボックスは、通常、「正しいですか？」など、 ユーザーに選択を許可するために使用されます 。ダイアログ ボックス ([OK] ボタンと [キャンセル] ボタンを含む) を表示します。

var mymessage=confirm("你喜欢JavaScript吗?"); ログイン後にコピー 2-4 promte

はメッセージ ダイアログ ボックスをポップアップ表示します。これは通常、 ユーザーと対話する必要がある情報を要求するために使用されます 。メッセージ ダイアログ ボックス ([OK] ボタン、[キャンセル] ボタン、テキスト入力ボックスを含む) をポップアップ表示します。

prompt(str1, str2); ログイン後にコピー パラメータ:

str1: メッセージダイアログボックスに表示されるテキスト、変更できません

str2: テキストボックスの内容、変更できます

で [OK] ボタンをクリックしますダイアログ ボックス、テキスト ボックスの内容は関数の戻り値として使用されます。ダイアログ ボックスのキャンセル ボタンをクリックすると null が返されます

2-5 新しいウィンドウを開きます

window.open([URL], [窗口名称], [参数字符串]) ログイン後にコピー パラメータ:

URL : ウィンドウに必須のオプションのパラメータ Web ページの URL またはパスを表示します。このパラメータが省略されている場合、またはその値が空の文字列である場合、ドキュメントはウィンドウに表示されません。

ウィンドウ名 : オプションのパラメータ、開いているウィンドウの名前。

名前は文字、数字、下線文字で構成されます。

「_top」、「_blank」、「_self」は特別な意味を持つ名前です。

_blank: 対象ページを新しいウィンドウで表示します

_self: 現在のウィンドウに対象の Web ページを表示します

_top: フレーム化されたWebページの上部ウィンドウに対象のWebページを表示します

同じ名前のウィンドウは 1 つだけ作成できます。複数のウィンドウを作成する場合、同じ名前を付けることはできません。

名前にスペースを含めることはできません。

パラメータ文字列 : オプションのパラメータ、ウィンドウパラメータを設定します。各パラメータはカンマで区切られます。

window.open('http://www.imooc.com','_blank','width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes') ログイン後にコピー 2-6 ウィンドウを閉じる

window.close(); //关闭本窗口 或 window.close(); //关闭本窗口 ログイン後にコピー 新しく作成したウィンドウを閉じる

var mywin=window.open('http://www.imooc.com'); //将新打的窗口对象，存储在变量mywin中 mywin.close(); ログイン後にコピー 注: 上記のコードは、新しいウィンドウを開いている間にウィンドウを閉じます。開いているウィンドウは表示されません。

2-7わずか

3-1

认识DOM文档对象模型DOM（Document Object Model）定义访问和处理HTML文档的标准方法。DOM 将HTML文档呈现为带有元素、属性和文本的树结构（节点树）。

HTML文档可以说由节点构成的集合，三种常见的DOM节点:

元素节点：上图中 、 、 等都是元素节点，即标签。

文本节点:向用户展示的内容，如 ... 中的JavaScript、DOM、CSS等文本。

属性节点:元素属性，如 标签的链接属性href="http://www.imooc.com"

3-2 通过ID获取元素

document.getElementById(“id”) ログイン後にコピー 该示例打印并非理想结果，是因为从浏览器读取html文件来说，是从上到下读取的：如果将JavaScript放在head中，HTML文件读取时会先读取并执行JavaScript的内容，然后才会执行body标签内的内容；如果放在body标签内，HTML文件读取时，会先读取在JavaScript前面的内容，再读取JavaScript的内容；

从上面这个原理与课程结合进行分析：

结果为null是因为，JavaScript没有找到id名为“con”的标签，所以返回null。

结果为 [object HTMLParagraphElement] ，则说明JavaScript找到了id名为“con”的标签，以对象的形式返回该标签

但是我们发现在HTML中明明存在id=“con”的标签，这又是怎么回事？这是因为，前面说的浏览器读取HTML文件，是从上到下读取的：

如果将JavaScript放在id=“con”的标签之前，这就导致了浏览器在读取HTML文件时，JavaScript先读取，读取完JavaScript后，才开始读取到id=“con”的标签，这就是说JavaScript读取时是没有读取到id=‘con’的标签，只能返回null，表示没有读取到该标签

如果将JavaScript放在id=“con”的标签之后，在浏览器读取HTML文件时，先读取到了id="con"的标签，才读取JavaScript，这时由于id="con"的标签名存在，JavaScript可以发现，所以以对对象的形式（[object HTMLParagraphElement]）返回该标签

要返回正确的结果应该在前后加双引号或者在mychar变量后加上.innerHTML

3-3 innerHTML属性

获取元素内容

var mychar= document.getElementById("con"); document.write("原标题:"+mychar.innerHTML+" "); //输出原h2标签内容 mychar.innerHTML = 'Hello world!' document.write("修改后的标题:"+mychar.innerHTML); //输出修改后h2标签内容 ログイン後にコピー 3-4 改变 HTML样式

Object.style.property=new style; //Object是获取的元素对象 ログイン後にコピー

3-5 显示和隐藏

Object.style.display = value ログイン後にコピー

3-6 控制class属性 元素

object.className = classname 注意中间有个大写的N ログイン後にコピー 进阶内容 2-2

变量取名 规则：

必须以字母、下划线或美元符号开头，后面可以跟字母、下划线、美元符号和数字。如下:

变量名区分大小写，如:A与a是两个不同变量。

不允许使用JavaScript关键字和保留字做变量名。

2-9 “&&”表示and 操作符

2-10 "||" 或

2-11 "!" 否

2-12 操作符之间的 优先级 （高到低）:

算术操作符 → 比较操作符 → 逻辑操作符 → "="赋值符号

如果同级的运算是按从左到右次序进行,多层括号由里向外。

3-1 数组

3-2

var myarray= new Array(8); //创建数组，存储8个数据。 ログイン後にコピー 注意：

1.创建的新数组是空数组， 没有值，如输出，则显示undefined 。

2.虽然创建数组时，指定了长度，但实际上 数组都是变长的 ，也就是说即使指定了长度为8，仍然可以将元素存储在规定长度以外。

3-3 添加元素

只需 使用下一个未用的索引 ，任何时刻可以不断向数组增加新元素。

myarray[5]=88; //使用一个新索引，为数组增加一个新元素 ログイン後にコピー 3-6 length属性

myarray.length; //获得数组myarray的长度 ログイン後にコピー 相关推荐：

JavaScript学习笔记之基础语法

整理Javascript基础语法学习笔记

php 8、私も来ます

ウェブサイトのレイアウトを 30 分で学ぶ

ビデオチュートリアルに精通したOracleの入門

あなたの最初のUNI-APPコード

ゼロからアプリの起動までフラッター

兄弟連新版Linuxビデオチュートリアル

AXURE 9 ビデオチュートリアル (プロダクトマネージャーのインタラクティブな製品設計 UI に適しています)

基礎能力ゼロ PS ビデオチュートリアル

16日間のUIビデオチュートリアル

PS テクニックとスライステクニックのビデオチュートリアル

アリクラウド環境構築およびプロジェクトオンラインビデオチュートリアル

コンピュータネットワークの概要 - プログラマが身につけるべき基礎知識

プログラマーのための基本チュートリアル - HTTP プロトコルの説明

Websocket ビデオチュートリアル

【JavaScript学習】js構文の基礎