• JavaScript基础知识总结


    1、  js运算符:

    算术运算符

               +  -   *  /  %  ++   --    =      +=       -= 

               加 减 乘 除 模 累加 递减 等于 等差增加 等差递减

    逻辑运算符

       ||     &&    !

       或   且    非

    2、  字符串处理的小方法:

    (1)       str.indexOf(‘要查找的字符串’)  从前往后查找字符串位置,大小写敏感,从0开始计数,返回数字,找不到返回-1。

    (2)       str.lastIndexOf(‘要查找的字符串’)  从后往前查找字符串位置,但从前往后计数,同样返回数字,找不到返回-1。

    (3)       str.length  字符串长度

    (4)       str.charAt(‘数字’)  返回该数字对应的位置的字符,从0开始计数

    (5)       str.substring(start,end)   截取字符串,从start位置开始,到end前的位置结束。返回截出的字符串,包含start位置字符,不包含end位置字符,即左闭右开。start为必选非负整数,end为非必选非负整数,不写end时,指从start位置截到最后。

    区分:str.substring()、str.slice()和str.substr()

    l  与 slice() 和 substr() 方法不同的是,substring() 不接受负的参数。

    l  str.slice(start,end)非负数用法和substring()类似,当start为负数时,如-1,表示从字符串倒数第一个字符开始截取。

    l  ECMAscript 没有对该方法进行标准化,因此反对使用substr()。

    (6)       str.split(‘切的方式’)  切割字符串,将字符串用某个字符或串切成数组,即返回数组

    (7)       str.toUpperCase()   转成大写

    (8)       str.toLowerCase()   转成小写

    3、  数组处理的小方法:

    (1)       arr.push(需要添加的东西)  添加到数组后面,返回新数组

    (2)       arr.pop()   从数组后面删除一项,返回新数组

    (3)       arr.unshift(需要添加的东西)   添加到数组前面,返回新数组

    (4)       arr.shift()    从数组前面删除一项,返回新数组

    (5)       arr.splice(开始位置,删除的个数,添加元素1,元素2…) 万能操作:删除、添加、替换,添加的元素1和2…非必选,返回新数组

    (6)       arr.join(‘拼接的方式’)  将数组通过某个字符或串拼接成字符串,即返回字符串

    (7)       arr.contact(数组1, 数组2 …)  连接数组,返回新数组

    (8)       arr.reverse()   反转,返回新数组

    (9)       arr.sort(function(n1, n2){

                 return n1 – n2;     // 从小到大排序

    })

    arr.sort(function(n1, n2){

                 return n2 – n1;     // 从大到小排序

    })

    4、  json对象处理的小方法:

    (1)添加或替换一项obj.a = b或obj[a] = b     返回新对象obj = {a:’b’}

    (2)删除一项delete obj.a 或delete obj.b   返回新对象obj

    5、  数学小方法:

    (1)       Math.floor(x)  向下取整

    (2)       Math.ceil(x)  向上取整

    (3)       Math.round(x)  四舍五入

    (4)       Math.random()  0-1的随机数

    (5)       Math.abs(x)   绝对值

    (6)       Math.max(x,y)   最大值

    (7)       Math.min(x,y)   最小值

    (8)       Math.sqrt(x)   求平方

    (9)       Math.pow(数,次方数)   求次方

    (10)   Math.PI   π

    (11)   Math.sin(角度)  正弦

    (12)   Math.cos(角度)  余弦

    (13)   Math.tan(角度)  正切

    (14)   Math.asin(弧度)   反正弦

    (15)   Math.acos(弧度)  反余弦

    (16)   Math.atan(弧度)  反正切

    6、 常用的全局函数

    (1)eval()   计算 JavaScript 字符串,并把它作为脚本代码来执行。使用方法eval('('+str+')')

    (2)Number()    把对象的值转换为数字。

    (3)parseInt()   解析一个字符串并返回一个整数。

    (4)parseFloat()    解析一个字符串并返回一个浮点数。

    (5)isNaN()    检查某个值是否是数字。

    (6)String()    把对象的值转换为字符串。

    7、关于时间的小方法:

    var oDate = new Date();

    获取:

    (1)oDate.getTime()    时间戳 – 从1970年到此刻的毫秒数

    (2)oDate.getFullYear()  年

    (3)oDate.getMonth()   月 – 从0开始代表1月

    (4)oDate.getDate()     日

    (5)oDate.getHours()     时

    (6)oDate.getMinutes()   分

    (7)oDate.getSeconds()   秒

    (8)oDate.getDay()      星期  -- 从0开始代表星期日

    设置:

    (1)oDate.setFullYear(年,月,日)   把时间设置到某年某月某日

    (2)oDate.setHours(时,分,秒,毫秒)  把时间设置到某时某分某秒某毫秒

    (3)oDate.setDate()    把时间设置到某天。自动进位,如果有那一天,就设置那一天,如果没有,就自动跑到下一个月或者上一个月

    8、关于DOM  --  文档(document)、对象(object)、模型(model)

    (1)DOM关系

      a) 父节点:obj.parentNode

      b) 子节点:obj.children   -- 得到一组元素

      c) 兄节点:obj.previousElementSibling || obj.previousSibling   -- 前者兼容高版本浏览器,后者兼容低版本浏览器

      d) 弟节点:obj.nextElementSibling || obj.nextSibling  -- 同上

      e) 首节点:obj.firstElementChild || obj.firstChild  -- 等同于obj.children[0] -- 同上

      f) 尾节点:obj.lastElementChild || obj.lastChild  -- 等同于obj.children[obj.children.length - 1]  -- 同上

    (2)DOM操作

      a) 创建:document.createElement('div')

      b) 添加:父节点.appendChild(子节点)   --  在父节点内部的最后添加

          父节点.insertBefore(要添加的元素,某个子节点之前)   -- 向父节点内部的某个子节点之前添加

      c) 删除:父节点.removeChild(子节点)

    9、关于BOM  -- 浏览器(browser)、对象(object)、模型(model)

    (1)window.open(地址, 打开方式)

      打开方式包括:a) _blank   新页面

               b) _self   当前页面

      Chrome:拦截 从用户体验      FF:阻止      IE:直接打开

      如果是用户触发:直接打开

    (2)window.close()

      Chrome:直接关闭     FF:没有反应      IE:给个提示框

    (3)window.location.href   当前页面的地址

        window.location.search   数据

        window.location.hash   锚点

        其他:

        window.location.host   地址

        window.location.hostname   域名

        window.location.pathname   路径

        window.location.port   端口

        window.location.protocol  协议

    (4)window.history.forward()    前进

        window.history.back()   后退

        window.history.go(数字)   --  1 前进;-1 后退;2前进两个页面;-2  后退两个页面

    10、关于各种距离

    (1)滚动条滚动的距离

      var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;     -- 前者兼容chrome,后者兼容FF和IE

    (2)可视区高度

      var clientH = document.documentElement.clientHeight;  

    (3)物体的高度

      var oH = obj.offsetHeight;

    综上,可得到物体的top值top = scrollTop + clientH - oH + 'px';

    11、关于事件

    (1)事件冒泡

      触发子元素的事件,传递给父级,如果父级有这个事件,则会触发,如果没有继续传递,直到document为止  

      阻止冒泡:
        oEvent.cancelBubble=true;

    (2)事件捕获

    (3)事件委托

  • 相关阅读:
    [PHP] class_exists类不存在时会调用__autoload函数
    [Redis] Redis的消息机制- 发布订阅
    [发电] 现在正式入驻爱发电平台
    [MySQL] PHP IP登录限制的实现
    [Redis] 哈希表的Rehash机制
    [Redis] redis的hash类型底层结构哈希表
    [Linux] ls命令的几个常用参数实现按时间/文件大小排序
    [Go] 在gin框架gorm下查询一对多的数据
    [Redis] list底层的数据结构
    [GO]go redis实现滑动窗口限流-redis版
  • 原文地址:https://www.cnblogs.com/uno1990/p/7390333.html
Copyright © 2020-2023  润新知