javaScript要点总结
在 JavaScript 中, 對象和函數同樣也是變量。
變量在函數內聲明，變量為局部作用域。
局部變量在函數開始執行時創建，函數執行完后局部變量會自動銷毀。
變量在函數外定義，即為全局變量。
全局變量有 全局作用域: 網頁中所有腳本和函數均可使用。?
如果變量在函數內沒有聲明（沒有使用 var 關鍵字），該變量為全局變量。
局部變量在函數執行完畢后銷毀。
全局變量在頁面關閉后銷毀。
在 HTML 中, 全局變量是 window 對象: 所有數據變量都屬于 window 對象。
當網頁被加載時，瀏覽器會創建頁面的文檔對象模型（Document Object Model）。
在 DOM 中查找 HTML 元素的最簡單的方法，是通過使用元素的 id。
var x=document.getElementById("intro");
通過標簽名查找 HTML 元素
例子，查找 id="main" 的元素，然后查找 id="main" 元素中的所有 <p> 元素：
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
通過類名找到 HTML 元素
例子，通過 getElementsByClassName 函數來查找 class="intro" 的元素：
var x=document.getElementsByClassName("intro");
JavaScript 擁有動態類型。這意味著相同的變量可用作不同的類型。
Webkit是瀏覽器引擎，包括html渲染和js解析功能。
NaN，即非數值（Not a Number），是一個特殊的數值，用于表示一個本來要返回數值的操作數未返回數值的情況。
數值轉換，Number()，可以用于任何數據類型。
parseInt()，將字符串轉換成數值。
parseFloat()，將字符串轉換成數值。
轉換為字符串，toString()，數值、布爾值、對象和字符串都有一個toString()方法，null和undefined值沒有這個方法。
Object是一組數據和功能的集合；通過new關鍵字創建；
var ?o ?= ?new Object();
js 判斷字符串中是否包含某個字符串，可以有三種方法；
String對象的方法，indexOf()，search()，match()；一般用第一種；
var str = "123";
console.log(str.indexOf("3") != -1 ); ?// true
========
?
通過 HTML DOM，可訪問 JavaScript HTML 文檔的所有元素。
在 JavaScript 中，document.write() 可用于直接向 HTML 輸出流寫內容。
不要在文檔加載完成之后使用 document.write()。這會覆蓋該文檔。
修改 HTML 內容的最簡單的方法是使用 innerHTML 屬性。
改變<p>元素的內容：
<p id="p1">Hello World!</p>
<script>
document.getElementById("p1").innerHTML="New text!";
</script>
改變<h1> 元素的內容：
<h1 id="header">Old Header</h1>
<script>
var element=document.getElementById("header");
element.innerHTML="New Header";
</script>
改變 HTML 屬性
document.getElementById(id).attribute=new value
改變<img> 元素的 src 屬性：
<img id="image" src="smiley.gif">
<script>
document.getElementById("image").src="landscape.jpg";
</script>
改變HTML元素的樣式 ? ?
document.getElementById(id).style.property=new style ? ?
改變 <p> 元素的樣式：
<p id="p2">Hello World!</p>?
<script>?
document.getElementById("p2").style.color="blue";?
</script>?
改變id="id1" 的 HTML 元素的樣式，當用戶點擊按鈕時
<h1 id="id1">My Heading 1</h1>?
<button type="button"?
οnclick="document.getElementById('id1').style.color='red'">?
Click Me!</button>?
HTML 事件：
當用戶點擊鼠標時
當網頁已加載時
當圖像已加載時
當鼠標移動到元素上時
當輸入字段被改變時
當提交 HTML 表單時
當用戶觸發按鍵時
在 <h1> 元素上點擊時，改變其內容：
<h1 οnclick="this.innerHTML='Ooops!'">點擊文本!</h1>?
從事件處理器調用一個函數：
<script>?
function changetext(id)?
{?
id.innerHTML="Ooops!";?
}?
</script>?
<body>?
<h1 οnclick="changetext(this)">Click on this text!</h1>?
</body>?
向 button 元素分配 onclick 事件：
<button οnclick="displayDate()">點我</button>
允許使用 JavaScript 來向 HTML 元素分配事件：
向 button 元素分配 onclick 事件：
document.getElementById("myBtn").οnclick=function(){displayDate()};?
onload 和 onunload 事件會在用戶進入或離開頁面時被觸發。
onload 事件可用于檢測訪問者的瀏覽器類型和瀏覽器版本，并基于這些信息來加載網頁的正確版本。
onload 和 onunload 事件可用于處理 cookie。
<body οnlοad="checkCookies()">
onchange 事件常結合對輸入字段的驗證來使用。
當用戶改變輸入字段的內容時，調用 upperCase() 函數：
<input type="text" id="fname" οnchange="upperCase()">
onmouseover 和 onmouseout 事件可用于在用戶的鼠標移至 HTML 元素上方或移出元素時觸發函數。
onmousedown, onmouseup 以及 onclick 構成了鼠標點擊事件的所有部分。首先當點擊鼠標按鈕時，會觸發 onmousedown 事件，當釋放鼠標按鈕時，會觸發 onmouseup 事件，當完成鼠標點擊時，會觸發 onclick 事件。
addEventListener() 方法用于向指定元素添加事件句柄。
addEventListener() 方法添加的事件句柄不會覆蓋已存在的事件句柄。
你可以向一個元素添加多個事件句柄。
事件冒泡或事件捕獲
事件傳遞有兩種方式：冒泡與捕獲。
事件傳遞定義了元素事件觸發的順序。 如果你將 <p> 元素插入到 <div> 元素中，用戶點擊 <p> 元素, 哪個元素的 "click" 事件先被觸發呢？
在冒泡中，內部元素的事件會先被觸發，然后再觸發外部元素，即： <p> 元素的點擊事件先觸發，然后會觸發 <div> 元素的點擊事件。
在捕獲中，外部元素的事件會先被觸發，然后才會觸發內部元素的事件，即： <div> 元素的點擊事件先觸發 ，然后再觸發 <p> 元素的點擊事件。
addEventListener() 方法可以指定 "useCapture" 參數來設置傳遞類型。
?
========
JavaScript 中的所有事物都是對象：字符串、數值、數組、函數。
JavaScript 允許自定義對象。
JavaScript 提供多個內建對象，如 String、Date、Array等。
對象只是帶有屬性和方法的特殊數據類型。
屬性是與對象相關的值。
訪問對象屬性的語法：objectName.propertyName
使用 String 對象的 length 屬性來獲得字符串的長度：
var message="Hello World!";
var x=message.length;
方法是能夠在對象上執行的動作。
可以通過以下語法來調用方法：
objectName.methodName()
使用 String 對象的 toUpperCase() 方法來將文本轉換為大寫：
var message="Hello world!";
var x=message.toUpperCase();
通過 JavaScript，能夠定義并創建自己的對象。
創建新對象有兩種不同的方法：
定義并創建對象的實例
使用函數來定義對象，然后創建新的對象實例
創建對象的一個新實例，并向其添加四個屬性：
person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";
替代語法（使用對象 literals）：
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};
使用對象構造器
使用函數來構造對象：
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}
創建 JavaScript 對象實例
一旦有了對象構造器，就可以創建新的對象實例，
var myFather=new person("Bill","Gates",56,"blue");
var myMother=new person("Steve","Jobs",48,"green");
可以通過為對象賦值，向已有對象添加新屬性：
假設 personObj 已存在 - 可以為其添加這些新屬性：firstname、lastname、age 以及 eyecolor：
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";
x=person.firstname;
把方法添加到 JavaScript 對象
方法只不過是附加在對象上的函數。
在構造器函數內部定義對象的方法：
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
}
changeName() 函數 name 的值賦給 person 的 lastname 屬性。
現在可以試一下：
myMother.changeName("Ballmer");
JavaScript 類
JavaScript 是面向對象的語言，但 JavaScript 不使用類。
在 JavaScript 中，不會創建類，也不會通過類來創建對象（就像在其他面向對象的語言中那樣）。
JavaScript 基于 prototype，而不是基于類的。
JavaScript for...in 循環
JavaScript for...in 語句循環遍歷對象的屬性。
語法
for (對象中的變量)
? {
? 要執行的代碼
? }
for...in 循環中的代碼塊將針對每個屬性執行一次。
循環遍歷對象的屬性：
var person={fname:"Bill",lname:"Gates",age:56};
for (x in person)
? {
? txt=txt + person[x];
? }
========
總結
以上是生活随笔為你收集整理的javaScript要点总结的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 超图js版本在地图上使用图标标记地理点
- 下一篇： DIV相关编程总结