レッスン-6

このバージョンの完璧なhasClassとCSSの方法。

新しいデータおよびattR

css: function(attr, val) { //链式测试

    for (var i = 0; i < this.length; i++) {
        if(typeof attr == 'string') {
            if (arguments.length == 1) {
                return getComputedStyle(this[0], null)[attr];
            }
            this[i].style[attr] = val;
        } else {
            var _this = this[i];
            f.each(attr,function(attr,val) {
                _this.style.cssText += '' + attr + ':' + val + ';';
            });
        }
    }
    return this;
}

私たちの以前のバージョンでは、我々は改善したいCSSのパスオブジェクトを、解析する方法はありません。

私たちは今、それぞれのメソッドを持っていることをちょうど良い！直接はそれを過ごします！

私たちのforループでは、attrのパラメータの下に渡された最初の判決は、文字列またはオブジェクトです。

文字列の場合、私たちは従いますcss('width','100px')、このように対処します

オブジェクトがある場合css({"width":'100px','height':'200px'})

var _this = this[i];
f.each(attr,function(attr,val) {
    _this.style.cssText += '' + attr + ':' + val + ';';
});

まず、私たちはこの電流をキャッシュし、cssText方法は、あなたがステッチに直接行くことができます。

その後、我々は次のために、ここで重要なhasClass注意方法を改善する必要がある！現在、私はhasClass方法に多くのを発見したとjQueryの実装が異なっています

例えば、このような構造のDOM

<div id="pox">
    <ul>
        <li class="a c">pox</li>
        <li class="b">pox</li>
        <li>pox</li><li>pox</li>
        <li>pox</li>
    </ul>
</div>

その結果、我々は$（ '＃痘李'）を書く場合。HasClass（ 'B'）と、それのようになります$（ '＃痘李'）。HasClass（ ''）？

結果はtrueを返しますです。

そして今、基本的にはこれをしなかった裁判官に見つけることができます。だから私は実装方法での外観をしましょう

hasClass : function(cls) {
    var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
    var arr = [];
    for (var i = 0; i < this.length; i++) {
        if (this[i].className.match(reg)) arr.push(true);
            else arr.push(false);
    }
    if (arr.indexOf(true) != -1)  return true;
        else  return false;
}

まず、我々は定期的に試合を必要とし、各要素を格納するために、まだ必要な配列は、クラスかどうかを裁判官が存在します

trueの場合、真の無の状況下で完全に偽を返すためにならば、私たちは、アレイで検索すると、本当ありますか、それは、trueを返します。私はここに誰もが次のことに注意したいと考えています

最後に、私たちのデータとメソッドのattr

attr : function(attr, val) {
    for (var i = 0; i < this.length; i++) {
        if(typeof attr == 'string') {
            if (arguments.length == 1) {
                return this[i].getAttribute(attr);
            }
            this[i].setAttribute(attr,val);
        } else {
            var _this = this[i];
            f.each(attr,function(attr,val) {
                _this.setAttribute(attr,val);;
            });
        }
    }
    return this;
},
data : function(attr, val) {
    for (var i = 0; i < this.length; i++) {
        if(typeof attr == 'string') {
            if (arguments.length == 1) {
                return this[i].getAttribute('data-' + attr);
            }
            this[i].setAttribute('data-' + attr,val);
        } else {
            var _this = this[i];
            f.each(attr,function(attr,val) {
                _this.setAttribute('data-' + attr,val);;
            });
        }
    }
    return this;
}

これらの2つの方法は、最初の文字列は、プロパティで直接増加である場合。それはオブジェクトである場合、セットにそれぞれ次の最初の引数は、文字列であるかどうかを判断CSS方式と同様の非常に単純な問題、です。

毛沢東はちょうどスターいじめを読んない、と述べた！:(

githubの住所：https://github.com/MeCKodo/forchange/tree/master/lesson-6は
、独自のシンプルなjQueryライブラリを実装することをお勧めしますか？（F）：http://segmentfault.com/a/1190000004013654

あなたはあなた自身の簡単なjQueryライブラリを実装することをお勧めしますか？（VII）

レッスン-6

おすすめ