• 通过一行代码学习javascript


    [].forEach.call($$("*"), function (a){
      a.style.outline = "1px solid #"+(~~(Math.random()*(1<<24))).toString(16) 
    })

    在控制台运行这段代码,可以给页面中所有元素加上1px、颜色随机的边框。下面来分析这段代码:

    $$只能在控制台中使用,作用跟document.querySelectorAll一样,所以在控制台以外的地方想选中页面中所有元素,可以用document.querySelectorAll("*")代替$$("*")。当然选中页面中所有元素的方法有很多,比如document.all,一样可以代替$$("*")。

    存储有所有元素的NodeList看起来像Array,可以用中括号去访问节点,拥有length属性。但它并没有Array的所有接口。是不是想起了函数里的Arguments变量。所以需要用call或apply调用Array的函数,并将第一个参数作为函数里面的this对象。

    单行代码中用[]代替了Array.prototype,节省了一些字节。这相当于在$$("*").forEach中,把$$("*")当成Array来使用。

    outline是CSS属性用于在元素外围增加轮廓,显示的边框在CSS区块模型外(不会占据空间,也不会对元素本身的布局和位置产生任何影响),语法和border一样。

    toString(16)可转换成16进制,Math.random()可生成0~1随机数。

    1<<24是位运算符,意思是将1转换成二进制数字再往左移24位,等同于十进制的2^24,这样随机数范围即为0~16777215.而parseInt("ffffff",16)=16777215正好是2^24.

    ~表示按位取反,位运算的操作值要求是整数,所以经过位运算的都会变成整数。这里~~取反两次,表示去掉小数部分。除了~~n,还可以使用n<<0,n>>0,n|0,这种取整方式无论正负都不会改变整数部分。

  • 相关阅读:
    【leetcode】1324. Print Words Vertically
    【leetcode】1323. Maximum 69 Number
    【leetcode】1320. Minimum Distance to Type a Word Using Two Fingers
    【leetcode】1319. Number of Operations to Make Network Connected
    7系列GTX中的疑惑
    8b10b
    hB
    MATLAB实现最优低通滤波器的函数
    modelsim读写TXT文件
    ILA用法
  • 原文地址:https://www.cnblogs.com/newgold/p/4894025.html
Copyright © 2020-2023  润新知