国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專(zhuān)欄INFORMATION COLUMN

可想實(shí)現(xiàn)一個(gè)自己的簡(jiǎn)單jQuery庫(kù)？(十二，完結(jié)篇)

joyqi / 1182人閱讀

摘要：新增事件部分講完了后我們最后實(shí)現(xiàn)個(gè)方法關(guān)于就常用的就種一個(gè)是取值一個(gè)是賦值我們通過(guò)判斷的個(gè)數(shù)是取值還是賦值賦值很容易我們就用最簡(jiǎn)單的辦法直接設(shè)置如果是取值那我們就要做個(gè)判斷因?yàn)楹偷娜》ㄊ遣灰粯拥倪€有一種可能性是當(dāng)元素的為的時(shí)候直接取是取不

Lesson-11

新增width,height,extend

事件部分講完了后,我們最后實(shí)現(xiàn)3個(gè)方法.

width : function(w) {
    if(arguments.length == 1) {
        for (var i = 0; i < this.length; i++) {
            this[i].style.width = w + "px";
        }
    } else {
        if (this[0].document === doc ) {
            return this[0].innerWidth;
        } else if (this[0].nodeType === 9 ){
            return document.documentElement.clientWidth;
        } else {
            return parseInt(getComputedStyle(this[0],null)["width"]);
        }
    }
},

關(guān)于width(),height()就常用的就2種,一個(gè)是取值,一個(gè)是賦值.

我們通過(guò)判斷arguments的個(gè)數(shù),是取值還是賦值.

賦值很容易,我們就用最簡(jiǎn)單的辦法,直接設(shè)置.

如果是取值,那我們就要做個(gè)判斷,因?yàn)閣indow,和document的取法是不一樣的.

還有一種可能性是,當(dāng)dom元素的display為none的時(shí)候,直接取是取不到的.在這我就不做處理了.大家思考一下可以自己嘗試.

思路是把dom設(shè)置為position:absolute;visible:hidden;然后取,在設(shè)置回去.

同理height方法也是如此.我就直接給出代碼了

height : function(h) {
    if(arguments.length == 1) {
        for (var i = 0; i < this.length; i++) {
            this[i].style.height = h + "px";
        }
    } else {
        if(this[0].document === doc ) {
            return this[0].innerHeight;
        } else if (this[0].nodeType === 9 ){
            return document.documentElement.clientHeight;
        } else {
            return parseInt(getComputedStyle(this[0],null)["height"]);
        }
    }
}

兩者幾乎相同只是改了API,其實(shí)完全可以封裝為一個(gè)方法復(fù)用.

jQuery之所以那么廣受大眾所愛(ài),還一個(gè)非常重要的就是他的extend方法.如果沒(méi)有了他,將不會(huì)有現(xiàn)在那么多jQuery插件的誕生

在此,我們就實(shí)現(xiàn)一個(gè)非常簡(jiǎn)單的淺拷貝.(然而jQuery的extend非常強(qiáng)大)

Kodo.prototype.extend = Kodo.extend = function() {
    var options = arguments[0];
    for( var i in options) {
        this[i] = options[i];
    }
};

這個(gè)方法我們不僅要能拓展靜態(tài)方法,也要能拓展實(shí)例方法.

所以 Kodo.prototype.extend = Kodo.extend = 直接這樣寫(xiě)了.

里面內(nèi)容過(guò)于簡(jiǎn)陋就不過(guò)多講解了 :)

然后我們就能這樣拓展我們的插件了

f.prototype.extend({  //實(shí)例方法
    alert : function(msg) {
        alert(msg)
    }
});
f.extend({ //靜態(tài)方法
    alert : function(msg) {
        alert(msg)
    }
});

f.alert("123");//調(diào)用
f("div").alert("123");//調(diào)用

其實(shí)jQuery還有很多別的部分,比如隊(duì)列,動(dòng)畫(huà),異步.都是一些非常值得自己去實(shí)踐嘗試的.

但至此,我們的小輪子基本也就完結(jié)了

另外的手勢(shì)番外篇,本想直接集成在這里面.如果有大眾所需,我就繼續(xù)更下去

您連11節(jié)的課程都有耐心看完,何必不順手點(diǎn)下右上角的star呢? >.<

github地址: https://github.com/MeCKodo/forchange/tree/master/lessonn-11
可想實(shí)現(xiàn)一個(gè)自己的簡(jiǎn)單jQuery庫(kù)？(十)：http://segmentfault.com/a/1190000004028806

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/49673.html

相關(guān)文章

  • 可想實(shí)現(xiàn)一個(gè)自己的簡(jiǎn)單jQuery庫(kù)？(十二，完結(jié)篇)

    摘要：新增事件部分講完了后我們最后實(shí)現(xiàn)個(gè)方法關(guān)于就常用的就種一個(gè)是取值一個(gè)是賦值我們通過(guò)判斷的個(gè)數(shù)是取值還是賦值賦值很容易我們就用最簡(jiǎn)單的辦法直接設(shè)置如果是取值那我們就要做個(gè)判斷因?yàn)楹偷娜》ㄊ遣灰粯拥倪€有一種可能性是當(dāng)元素的為的時(shí)候直接取是取不 Lesson-11 新增width,height,extend 事件部分講完了后,我們最后實(shí)現(xiàn)3個(gè)方法. width : function(w) ...

    ivan_qhz 評(píng)論0 收藏0

  • JavaScript專(zhuān)題系列20篇正式完結(jié)！

    摘要：寫(xiě)在前面專(zhuān)題系列是我寫(xiě)的第二個(gè)系列，第一個(gè)系列是深入系列。專(zhuān)題系列自月日發(fā)布第一篇文章，到月日發(fā)布最后一篇，感謝各位朋友的收藏點(diǎn)贊，鼓勵(lì)指正。 寫(xiě)在前面 JavaScript 專(zhuān)題系列是我寫(xiě)的第二個(gè)系列，第一個(gè)系列是 JavaScript 深入系列。 JavaScript 專(zhuān)題系列共計(jì) 20 篇，主要研究日常開(kāi)發(fā)中一些功能點(diǎn)的實(shí)現(xiàn)，比如防抖、節(jié)流、去重、類(lèi)型判斷、拷貝、最值、扁平、柯里...

    sixleaves 評(píng)論0 收藏0

  • 可想實(shí)現(xiàn)一個(gè)自己的簡(jiǎn)單jQuery庫(kù)？(三)

    摘要：這個(gè)版本新增這個(gè)選擇元素的方法還是比較常用的首先我們需要一個(gè)來(lái)過(guò)濾我們需要的上面那段比較簡(jiǎn)單就是普通的過(guò)濾下元素看下方法的源碼就知道我傳入數(shù)組對(duì)象的個(gè)對(duì)象然后取它的下一個(gè)同輩元素直接返回方法同理這段是取到第一個(gè)父元素由于返回的不是原生的對(duì) Lesson-2 這個(gè)版本新增 next(),prev(),parent(),parents() 這4個(gè)選擇元素的方法還是比較常用的 首先我們需要...

    xiaoxiaozi 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<