js、js の基本的な構文、および js の変数を知る

1. js を知っている:

js の概念:

ブラウザ側(クライアント側)で解釈された(行単位の)スクリプト言語を実行する

js の役割:

html: 構造 (スケルトン)

css : パフォーマンス (美化)

js : 動作 (動的効果: カルーセル、タブ切り替え、フロア、ドラッグ アンド ドロップ、Baidu 検索ボックス、フォームの検証、ログインと登録、ヘビを食べる)

js のコア:

		(ECMA:规范js语法;w3c:规范html 和css)

1. ECMAScript: js の文法仕様を指定します。

2. BOM (browser object model): ブラウザーを操作するための API のセットを提供するブラウザー オブジェクト モデル (ブラウザー ウィンドウの開閉、進むおよび戻る go(-1)、)

3. DOM (ドキュメント オブジェクト モデル): ページ (ページのラベル) を操作するための一連の API を提供するドキュメント オブジェクト モデル

Bom と dom は js を使用してページとブラウザーを操作します

2.jsの基本文法

1.JSコードの書き方

1.1 インライン スタイル

タグの href="javascript:js code;"

<button behavior attribute="js code"> 非タグのボタン

1.2. 埋め込み

書き方:スクリプト

書き込み位置:スクリプトは任意の位置に記述できますが、上に書くことはお勧めできません。下に書くことをお勧めします

実行順序: 複数のスクリプト タグのペアが存在する可能性があり、上から下に実行されます

1.3. 外部リンク

記述方法:script src=""

注: 1. 外部チェーン書き込み方式では、script タグ内のコードは実行されません。

2. demo.js に js コードを直接記述します。

<!DOCTYPE html>
<html>
    <head>
        <title>做真实的自己</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
        <style>
            div{
      
      
                width: 100px;
                height: 100px;
                background-color: pink;
            }
        </style>
    </head>
    <body>
        <!-- 行内式:a标签的形式 -->
        <a href="javascript:alert(1);">hah</a>
        <!-- js的方式防止跳转 -->
        <a href="javascript:;">hah</a>
        <a href="#">hah</a>
        <!--行内式:非a标签的形式  -->
        <!-- <button 行为属性='js代码'>按钮</button> -->
        <!-- onclick,点击 -->
        <button onclick='alert(1)'>按钮</button>
        <!--onmouseover鼠标移入  onmouseout鼠标移出  -->
        <div onmouseover="alert(8)" onmouseout="alert(9)"></div>
    <!-- 
    1、行内式
        a标签的   <a href="javascript:js代码;">百度</a>
        非a标签的 <button 行为属性="js代码">按钮</button>
    2、内嵌式
        书写方式:<script></script>
        书写位置:可以在任何位置书写<script></script>,但是不推荐写在最上面,推荐写在最下面
        执行顺序:可以有多对script标签,从上往下执行
    3、外链
        书写方式:<script src="demo.js">  </script>
        注意:1. 在外链式的写法中,script标签内部代码不执行
             2. demo.js 中直接写js代码
    -->
    </body>
</html>
<script src="js/demo.js"></script>

2.js コメント

複数行コメントと単行コメントに分かれています

役割:コードの説明

一行コメント: ctrl+/

複数行コメント: alt+shift+a

3.js 変数

変数の定義方法:

3.1 一般的に使用される方法

var x = 2;//変数xを宣言し、同時にxに2を代入;

var: 変数を宣言します

x : 変数名 (クラス名と同様)

= : 割り当て (右側の値を左側に割り当てます)

3.2 その他の方法

var x ; //最初に変数を宣言します

x = 20 ;//使用時に代入


複数の変数を同時に宣言し、使用時に代入する

var a,b,c; //最初に複数の変数を宣言します

a = 20 ;

b = 20;

c = 20;//使用時に代入


複数の変数を同時に宣言し、いくつかは割り当てられ、一部は使用時に割り当てられます

var a = 20,b = 20, c;

c = 20;

3.3 js 出力構文

ポップアップの内容 (警告ボックス): +alert(content);

ブラウザのコンソールに書き込みます (コンソールにコンテンツを出力します): +console.log(content)

ページ (html) 出力: +document.write(content)

3.4 jsの命名規則と仕様

ルール: (ルールに従う必要があります。従わない場合、エラーが報告されます)

1. コンポーネント: 数字、文字、アンダースコア、ドル記号 ($)

2.数字で始めることはできません

3. js のキーワードおよび予約語 (予約語がキーワードに発展する可能性があります)、(var if など) は使用できません。

4. 大文字と小文字を厳密に区別する

仕様: (全員が従う必要がある合意事項)

1.キャメルケースの命名法(最初の単語は小文字、2番目の単語から最初の文字は大文字になります)

2. 名前を見て心を知る

3. 中国語は非推奨 (中国語はサポートされていますが非推奨)

3.5 js のデータ型と型変換

1. データ型:

2つのカテゴリ:
基本データ型:
数値型 数値型
文字列型
文字列型 ブール型 ブール型
Null型 空型
未定義型 未定義型
参照データ型:(わかる)
オブジェクト

2. 基本データ型

a.数値型(数値)

タイプ(2進数、10進数、16進数などを含む)

a) 整数
b) 10 進数
c) 10e5 (科学表記法) 10*10 の 5 乗
d) 10 進数 8 進数 16 進数 2 進数
e) NaN (数値ではない)。数値以外の特殊な値を表します。この属性は、値が数値ではないことを示すために使用されます

b.文字列型(文字列)

内容 (一重引用符または二重引用符で囲みます)

テキスト

c.ブール型(boolean ブール値)

(真または偽)

true: true、コンピューターは true を 1 として保存します
false: false、コンピューターは false を 0 として保存します

d. Null 型 (null 空値)

1 つしかありません。これは null であり、空であることを意味します

宣言された値は null です

e、未定義型(未定義未定義値)

undefined 、値がないことを意味します

宣言されているだけで、割り当てられていない

3. データ型 typeofe の検出

構文: typeof(検出する値)
typeof 検出する値;

2 つの違い: 操作がある場合の検出にブラケット構文を使用する

例: typeof ("3"+2): "3"+2 のスプライシング結果のタイプを検出します

typeof "3"+2: "3" type+2 の連結結果を検出

戻り値(結果):

どのデータ型 (数値、文字列、未定義、オブジェクト、ブール)

null はオブジェクトを返します。

4. データ型変換

: 数値から文字列への変換、文字列からブール値への変換、ブール値から数値への変換など、データ型間の変換

4.1 他のデータ型を値に変換する:

4.1.1 数値(変換が必要な内容)

変換が必要なコンテンツ全体を変換する

全体が数値であれば変換成功で数値になります

全体が純粋な数でない場合 (10 進数も NaN を返します)、変換できず、NaN を返します
4.1.2 parseInt (変換が必要なコンテンツ)

1桁目から調べて、数字なら換算して、数字じゃないものがあることを知る

先頭は数値ではないのでそのままNaNを返す小数点が
わからない

4.1.3 parseFloat (変換が必要なコンテンツ)

1桁目からチェック、数字なら変換、数字じゃない内容まで

が先頭の数値でない場合は、直接 NaN を返します


小数点を一度知っておく

4.2 他のデータ型を文字列に変換する

1.変数.toString()

2. 文字列 (変数)

3.追加を使用する

4. 他のデータ型を文字列ブール値 (変数) に変換します。

jsでは''、0、null、undefined、NaNのみ、これらはfalse、残りはtrue

おすすめ

転載: blog.csdn.net/qq_45349018/article/details/121614196