JavaScript入門系列之知識點總結_javascript技巧-js教程-PHP中文網

首頁

web前端

js教程

JavaScript入門系列之知識點總結_javascript技巧

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 03:08 PM

JavaScript一種直譯式腳本語言，是一種動態類型、弱型別、基於原型的語言，內建支援型別。它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用於客戶端的腳本語言，最早是在HTML（標準通用標記語言下的一個應用）網頁上使用，用來為HTML網頁增加動態功能。

一、準備工作：

1.為什麼要學習JavaScript

所有的主流瀏覽器都只是Javascript

大部分網頁都使用Javascript

它可以讓網頁呈現各種動態效果

易學

2、如何插入JS

4、JS在頁中的位置

javascript作為一種腳本語言可以放在html頁面中任何位置，我們通常放在網頁的head或body部分。但是瀏覽器解釋html時是先後順序的，所以前面的script就先執行。例如進行頁面顯示初始化的js必須放在head裡面，因為初始化都要求提前進行（如給頁面body設定css等）；而如果是透過事件呼叫執行的function那麼對位置沒什麼要求的。

5、語句與符號

每一句JavaScript程式碼格式: 語句;

6、註解方法

單行註釋，在註釋內容前加符號 “//”。

多行註解以"/*"開始，以"*/"結束。

7、變數

定義變數使用關鍵字var,語法如下：

var 變數名

變數名可以任意取名，但要遵循命名規則:

1.變數名稱必須使用字母或底線(_)開始。

2.變數名稱必須使用英文字母、數字、底線(_)組成。

3.變數名稱不能使用JavaScript關鍵字與JavaScript保留字。

8、判斷語句（if...else）

文法:

if(条件)
{ 条件成立时执行的代码 }
else
{ 条件不成立时执行的代码 }

9、函數

function 函数名()
{
函数代码;
}

説明:

1. function キーワードは関数を定義します。

2.「関数名」は関数に付ける名前です。

3. 「関数コード」を特定の関数を完了するコードに置き換えます。

関数呼び出し:

関数を定義した後は、自動的に実行することはできないため、関数を呼び出す必要がある場合は、必要な場所に関数を直接記述するだけです

2. よく使用される対話方法

1. 出力内容(document.write)

document.write() を使用すると、コンテンツを HTML 出力ストリームに直接書き込むことができます。簡単に言うと、コンテンツをWebページ上に直接出力することです。

1つ目のタイプ: 出力内容を""で囲み、""内の内容をそのまま出力します。

2 番目のタイプ: 変数を介してコンテンツを出力

3 番目のタイプ: 複数のコンテンツを出力し、コンテンツを + 記号で接続します。

4 番目の方法: HTML タグを出力し、タグを "" で囲みます。

2. 警告（警告メッセージダイアログボックス）

小さなウィンドウにメッセージテキストが表示されます (アラートはメッセージダイアログボックス ([OK] ボタンを含む) を表示します):alert (文字列または変数);

注:

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

2. メッセージダイアログボックスは通常、プログラムのデバッグに使用できます。

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

3. 確認（メッセージ確認ダイアログ）

ダイアログボックス ([OK] ボタンと [キャンセル] ボタンを含む) をポップアップします。確認(str);

パラメータの説明:

str: メッセージダイアログボックスに表示されるテキスト

戻り値: ブール値

戻り値:

ユーザーが「OK」ボタンをクリックすると、true を返します

ユーザーが「キャンセル」ボタンをクリックすると、false を返します

注: 戻り値を使用して、ユーザーがどのボタンをクリックしたかを判断できます

注: メッセージダイアログボックスは排他的です。つまり、ユーザーはダイアログボックス内のボタンをクリックするまで他の操作を実行できません。

4. 質問 (プロンプトメッセージダイアログボックス)

メッセージダイアログボックス (OK ボタン、キャンセルボタン、テキスト入力ボックスを含む) をポップアップします。prompt(str1, str2);

パラメータの説明:

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

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

戻り値:

1. [OK] ボタンをクリックすると、テキストボックスの内容が関数の戻り値として使用されます

2. キャンセルボタンをクリックすると null が返されます

注: ユーザーがダイアログボックスのボタンをクリックするまで、他の操作は実行できません。

5. 新しいウィンドウを開きます (window.open)

open() メソッドは、新しいウィンドウを開くために使用されます: window.open(, , )

パラメータの説明:

URL: ウィンドウを開くための URL またはパス。

ウィンドウ名: 開いているウィンドウの名前。

「_top」、「_blank」、「_selft」などを使用できます。

パラメータ文字列: ウィンドウパラメータを設定します。各パラメータはカンマで区切られます。 (上、左、幅、高さ、メニューバー、ツールバー、スクロールバー、ステータス)

注:

1. パラメータ間のカンマと等号の前後にスペースがある場合、その文字列は無効になります。スペースを削除するだけで正常に実行できます。

2. 実行結果にはブラウザの互換性の問題が考慮されています。

6. ウィンドウを閉じる (window.close)

window.close(); // 指定されたウィンドウを閉じます

.close();

3. DOM 操作

1. DOM について知る

ドキュメントオブジェクトモデル DOM (ドキュメントオブジェクトモデル) は、HTML ドキュメントにアクセスして処理するための標準メソッドを定義します。 DOM は HTML ドキュメントを要素としてレンダリングします。

属性とテキストのツリー構造(ノードツリー)。

1. 要素ノード: 上の図では、、、

などはすべて要素ノード、つまりラベルです。

2. テキストノード:

...

内の JavaScript、DOM、CSS、その他のテキストなど、ユーザーに表示されるコンテンツ。

3. 属性ノード: タグのリンク属性 href="http://www.imooc.com" など。

2. ID で要素を取得します

document.getElementById(“id”)

注: 取得した要素はオブジェクトです。要素を操作したい場合は、そのプロパティまたはメソッドを使用する必要があります。

3. innerHTML 属性

.innerHTML プロパティは、HTML 要素のコンテンツを取得または置換するために使用されます。

Object.innerHTML

1.Object は、document.getElementById("ID") を通じて取得された要素など、取得された要素オブジェクトです。

2. 書き方に注意してください。innerHTML では大文字と小文字が区別されます

4. HTML スタイルを変更する

Object.style.property=新しいスタイル;

注: Object は、document.getElementById("id") を通じて取得される要素など、取得される要素オブジェクトです。

基本プロパティテーブル (プロパティ)

背景色/高さ/幅/色/フォント/フォントファミリー/フォントサイズ

5. 表示と非表示 (表示属性)

Object.style.display = 値

注: Object は、document.getElementById("id") を通じて取得される要素など、取得される要素オブジェクトです。

値:

none: この要素は表示されません (非表示になります)

ブロック: この要素はブロックレベル要素 (表示) として表示されます

6. コントロールクラス名(className属性)

要素のクラス属性を設定または返します

object.className = クラス名

1. 要素のクラス属性を取得します

2. Web ページ内の要素の CSS スタイルを指定して、要素の外観を変更します

陳述

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

在JavaScript中替換字符串字符Mar 11, 2025 am 12:07 AM

JavaScript字符串替換方法詳解及常見問題解答本文將探討兩種在JavaScript中替換字符串字符的方法：在JavaScript代碼內部替換和在網頁HTML內部替換。在JavaScript代碼內部替換字符串最直接的方法是使用replace()方法： str = str.replace("find","replace"); 該方法僅替換第一個匹配項。要替換所有匹配項，需使用正則表達式並添加全局標誌g： str = str.replace(/fi

自定義Google搜索API設置教程Mar 04, 2025 am 01:06 AM

本教程向您展示瞭如何將自定義的Google搜索API集成到您的博客或網站中，提供了比標準WordPress主題搜索功能更精緻的搜索體驗。令人驚訝的是簡單！您將能夠將搜索限制為Y

8令人驚嘆的jQuery頁面佈局插件Mar 06, 2025 am 12:48 AM

利用輕鬆的網頁佈局：8 ESTISSEL插件jQuery大大簡化了網頁佈局。本文重點介紹了簡化該過程的八個功能強大的JQuery插件，對於手動網站創建特別有用

構建您自己的Ajax Web應用程序Mar 09, 2025 am 12:11 AM

因此，在這裡，您準備好了解所有稱為Ajax的東西。但是，到底是什麼？ AJAX一詞是指用於創建動態，交互式Web內容的一系列寬鬆的技術。 Ajax一詞，最初由Jesse J創造

什麼是這個＆＃x27;在JavaScript？Mar 04, 2025 am 01:15 AM

核心要點 JavaScript 中的 this 通常指代“擁有”該方法的對象，但具體取決於函數的調用方式。沒有當前對象時，this 指代全局對象。在 Web 瀏覽器中，它由 window 表示。調用函數時，this 保持全局對象；但調用對象構造函數或其任何方法時，this 指代對象的實例。可以使用 call()、apply() 和 bind() 等方法更改 this 的上下文。這些方法使用給定的 this 值和參數調用函數。 JavaScript 是一門優秀的編程語言。幾年前，這句話可