一行のコードを通してjavascriptを勉強します.
1142 ワード
[].forEach.call($$("*"), function (a){
a.style.outline = "1px solid #"+(~~(Math.random()*(1<<24))).toString(16)
})
コンソールでこのコードを実行すると、ページ内のすべての要素に1 px、ランダムな色の枠線を付けることができます.このコードを分析します.ドルはコンソールでしか使えません.機能はドキュメンタ.querySelectorAllと同じですので、コンソール以外のところでページのすべての要素を選択したいです.もちろん、選択したページのすべての要素の方法は、ドル(*)の代わりに、Dcument.allなどさまざまです.
すべての要素が格納されているNodeListは、Arayのように見え、中かっこでノードにアクセスでき、length属性を持つ.しかし、Arayのすべてのインターフェースはありません.関数の中のAgments変数を思い出しましたか?したがって、callまたはappyでArayの関数を呼び出し、最初のパラメータを関数内のthisオブジェクトとして使用する必要があります.
行コードの[]はAray.prototypeの代わりに、いくつかのバイトを節約しました.これは$(*).forEachの中で、$(*)をArayとして使っています.
OutlineはCSS属性であり、要素の外周に輪郭を増加させるために使用され、表示される外枠はCSSブロックモデルの外にある(空間を占有しないし、要素自体の配置や位置に影響を与えない).文法はborderと同じである.
String(16)は16進数に変換でき、Math.random()は0〜1乱数を生成することができる.
1<<24はビット演算子で、1を2進数に変換してから24桁左にシフトするという意味です.10進数の2^24と同じです.乱数の範囲は0~16777215です.パーミッション(ffff)=16777215は2^24です.
~ビットで逆をとることを示し、ビット演算の操作値は整数を求めるため、ビット演算を行った場合は整数になります.ここで~を二回取って、小数点を除くことを表します.~n以外にも、n<<0,n>>0,n 124 0が使用されてもよく、このような整数部分は正負にかかわらず変化しない.