前端攻城獅 js之dom物件 2

2021-08-20 21:40:29 字數 1679 閱讀 4588

本章節主要講計算後樣式和測量的相關知識點。

我們可以通過dom提供的可靠的api,去獲採樣式計算後最終的值。

獲取計算後的樣式的方法有以下幾種

我們來分析一下三者的使用區別

-----getcomputedstyle("物件").getpropertyvalue("屬性")

該方法無法相容到ie6 7 8 ,後面的屬性同css樣式一樣的寫法

-----getcomputedstyle("物件")["屬性"];

該方法同樣也無法相容到ie6 7 8,後面的屬性可以用css名字,也可以用到駝峰式。駝峰式如background-color要寫成backgroundcolor

------物件.currentstyle.屬性/物件.currentstyle[屬性]

物件.currentstyle.屬性/物件.currentstyle[屬性]

該方法用於ie6 7 8,後面的屬性也需要駝峰式。

那麼有人會問,如果去相容到ie6 7 8要怎麼做?這時候我們就需要進行能力檢測。

if(window.getcomputedstyle)else,time)

2.settimeout(function(){},time)

setinterval

表示每個一段時間去呼叫方法。對應的清除方法是如下

var timer =  setinterval(function() , 50);

clearinterval(timer)

settimeout

表示延遲多少時間去呼叫方法,方法只呼叫一次。

var timer =  settimeout(function(), 1000);

cleartimeout(timer)

那麼我們就可以通過定時器,去給修改元素的值,從而變了動畫。下面我們來看看demo

以上demo就是用過定時器去不斷的改變left,當left到了的值大於702的時候,就要去解綁定時器。

有幾個注意點,從最後一張到第一張的過渡,每一張的無縫。

與後台的大部分資料互動都是json格式。

var person =

};其中name就是key,heihei就是value,key必須是字串帶著雙引號的。

如何去獲取key對應的value?如獲取name對應的值

person.name / person["name"]這兩種方式都可以去獲取。

如何去給person新增新的值呢?

person.hobby=["haha","heihei"];直接新增即可

如何去刪除某個屬性

delete person.age

如何迴圈的獲取person的k,value?

for(var k in person)    

同樣json物件還能存放方法

person.myfun=function();直接新增即可

js的dom物件的基本知識已講完,接下來會來講自己封裝乙個動畫運動框架,如有表達錯的請諒解,並請提出指出,且修改錯誤,望能共同進步。

前端攻城獅 js物件的高階使用 2

什麼是原型鏈?我們先不來解釋定義,我們先來看看下面幾個例子。xiaoming物件呼叫了乙個doing 方法,效果就是彈框並且上面有文字就是哈哈。試問為什麼會彈框?方法誰給的?tostring 方法哪來的?為什麼xiaoming可以呼叫tostring 方法?tostring 方法是誰的?首先xiao...

前端攻城獅 css樣式之定位

為什麼要學習定位呢?因為很重要。ps 這不是廢話嘛 這樣子把,假如說我們需要在乙個盒子裡居中顯示乙個小盒子,那麼就是需要定位來坐,定位用的頻率還是非常高的。css定位分為三種 絕對定位 相對定位 固定定位。各位看官不要急,聽我一一道來。相對定位 position relative 相對定位相對誰?相...

web前端攻城獅 表單驗證之電話驗證

我們這裡要用到的是 驗證介面,先給個 url rg inputphone val 用這種方式,在使用者註冊的時候會讓產品形象更好,更有依賴感 rg inputphone on blur function function testinputphone d d d d d d d d d d d d ...