JS之JavaScript中的面向對象及DOM操作

  1. 面向對象
  • 什麼是面向對象 :
    面向對象就是一種編程思路

  • 何爲對象?
    萬事萬物皆爲對象而在JavaScript 中,所謂的對象,就是鍵值對的集合

  • 面向對象的三大特徵 : 封裝 繼承 多態

  • JS中的內置對象

內置對象

eval()      計算表達式的值
isNaN()     是否是非數字的值

(1). Math對象

Math.round()    隨機產生0-1之間的數值

Math.random()   四捨五入

(2). Date對象(通過date對象既可以設置時間也可以獲取系統時間)

getHours()     返回Date對象的小時
getMinutes()   返回Date對象的分鐘
getSeconds()   返回Date對象的秒
  • 創建對象
(1)var 對象名={
			key:value,
			key:value
			}
(2)基於Object創建對象
	var Person=new Object();
			Person.a=a;
(3)在JS中創建對象
var Person={
				a:'aaa',
				b:222,
				c:'ccc',
				getName:function(){
					return this.name;
				}
			}
(4)構造函數
function Person(name,age,job,sex){
				this._name=name;
				this._age=age;
				this._job=job;
				this._sex=sex;
			}
var _person01=new Person('姓名',23 ,'工作','性別'); //用來傳遞實參
		
			
		

  1. DOM
    DOM 是 W3C的標準
    W3C DOM 標準被分爲 3 個不同的部分:
    (1)核心 DOM - 針對任何結構化文檔的標準模型
    (2)XML DOM - 針對 XML 文檔的標準模型
    (3)HTML DOM - 針對 HTML 文檔的標準模型
  • JS中的DOM節點操作
    在HTML中所有事物都是節點
    如 :
    整個文檔是一個文檔節點
    每個 HTML 元素是元素節點
    HTML 元素內的文本是文本節點
    每個 HTML 屬性是屬性節點

  • DOM方法

  1. 常用DOM方法

getElementById() 
返回帶有指定 ID 的元素

getElementsByTagName()
返回包含帶有指定標籤名稱的所有元素的節點 列表

getElementsByClassName()
返回包含帶有指定類名的所有元素的節點列表

getElementsByName() 
返回帶有指定 name 的所有元素的節點列表。

appendChild()    	把新的子節點添加到指定節點

removeChild()   	刪除子節點

replaceChild()   	替換子節點

insertBefore()  	在指定的子節點前面插入新的子節點

createElement()  	創建元素節點

createTextNode() 	創建文本節點

createAttribute()	創建屬性節點

getAttribute()   	返回指定的屬性值

setAttribute()  	把指定屬性設置或修改爲指定的值


2.常用DOM屬性

innerHTML	 	 元素的文本值 

parentNode 		 元素的父節點

childNodes 		 元素的子節點

attributes 		 元素的屬性節點

nodeName		 元素的名稱 

nodeValue		 元素的值 

nodeType		 元素的類型

注:JS部分到此就全部結束了,下一節進行jQuary的介紹等之後的內容

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章