我們都知道vue是使用object.defineproperty
來實現的資料雙向繫結。我們先來實現一下資料的雙向繫結。
var obj = {};
var a;
object.defineproperty(obj,'a',,
set: function(newval)
})複製**
這樣就可以實現乙個資料的雙向繫結。如果加上input只要稍微改造一下就可以
。
type="text"
id="input">
複製**
js部分
var input = document.queryselector("#input");
var obj = {};
var a;
object.defineproperty(obj, 'a', ,
set: function (newval)
})input.addeventlistener('input', function (e) )
複製**
這樣就實現了乙個雙向資料繫結,但是object.defineproperty
並不是完美的,它有優點也有缺點。
面試有時候也經常會問到:怎麼樣實現ie8及一下的雙向資料繫結。
對於上面這個問題,我們可以使用api的私有屬性。
我們經常見到的__proto__
凡是以__
開頭結尾的是瀏覽器的私有屬性,__definegetter__和__definesetter__
同樣也是私有屬性,這兩個屬性和object.defineproperty
一樣都是對物件新增屬性,object.defineproperty
相當於這兩個方法的合併。
怎麼使用它呢?
這兩個方法接收兩個引數:
例如:給obj物件新增乙個name屬性
obj.__definesetter__('name',function(val))
obj.__definegetter__('name',function())
複製**
如何使用這個api實現資料的雙向繫結呢?我們來實現一下。
var input = document.queryselector("#input");
var obj = {};
input.addeventlistener('input', function (e) )
var name;
obj.__definesetter__('name',function(val))
obj.__definegetter__('name',function())
複製**
哎呦,不錯哦。
在vue未出現之前,也是有mvvm框架產生的,比如說san.js
,它也是傳統的mvvm資料雙向繫結並且相容ie6。還有vbscript
,在vbscript中可以寫類,類中可以定義getter和setter,同樣可以實現資料的雙向繫結。
由於我自己能力有限,在這裡就實現這麼多了,如果各位有興趣的話,可以自己實現一下。
如何在ie8中新增事件控制代碼?
ie 8 及更早 ie 版本,opera 7.0及其更早版本不支援 addeventlistener 和 removeeventlistener 方法。但是,對於這類瀏覽器版本可以使用 attachevent detachevent 方法來新增 移除事件控制代碼。跨瀏覽器解決方法 var x doc...
如何刪除IE8
之前安裝了一下ie8 beta2感受了一下新的功能。執行起來也挺不錯的,但當我公升級到ie8 rc版本的時候問題就非常的多,不知道是不是公升級的問題,每次關掉ie都會報乙個錯誤,非常的鬱悶。而且在使用bs系統的時候也會報一些錯誤,然後就不能正常工作了,實在是沒有辦法,特別是給客戶演示系統的時候出現錯...
IE9如何相容IE8以及以下的瀏覽模式
自己寫了個js指令碼,本人一直用的是ie9 在一次測試中發現自己在外部寫的js指令碼缺不能在ie8及ie8以下的瀏覽模式中執行,網上搜了很多,都沒找到解決辦法,求各位大神給個辦法啊 在此多謝了 經過一下午的查閱 最後知道了在ie8一下呼叫js檔案時,回傳會說json未定義 有三個解決辦法 方法一 加...