Code前端首页关于Code前端联系我们

js常用方法总结

terry 2年前 (2023-09-09) 阅读数 147 #Javascript
js常用方法总结

字段重复数据删除

双FOR循环

for (let i = 0; i < arr.length - 1; i++) {
  let item = arr[i]
  for (let j = i + 1; j < arr.length; j++){
    if(item === arr[j]){
      // 用最后一项替代当前项
      arr[i] = arr[arr.length - 1]
      // 最后一项删掉
      arr.length--
      // 下一轮还和这一项比
      j--
    }
  }
}

缺点

  • 循环次数多,性能差

配对键 - 对象值

优点

  • 只有一个循环,所以性能不错

缺点

  • 如果字段中有对象,就会出现问题(因为对象的属性名称不能是对象,所以会转为字符串)
  • 如果数字是10,字符串'字段中存在 10',也会被考虑 即使重复字段中的值未定义也会出现问题

检测方法指标

let newAry = []
for (let i = 0; i < arr.length; i++) {
  let item = arr[i]
  if(newAry.indexOf(item) == -1){
    newAry.push(item)
  }
}

缺点

  • 旧版本浏览器不兼容

时间格式

如何获取DOM标签

document.getElementById

  • getElementById方法的上下文只能是文档

[上下文].getElementsByTagName,[上下文].getElementsByClassName

  • 得到的结果是一个HTMLCollection元素的集合(如数组:数字为索引,length代表长度)
  • 如果要操作某一项,需要通过索引获取然后处理

document.getElementsByName

  • 操作表单元素,尤其是单选按钮或复选框

如何获取DOM节点

节点类型

类型NodeType节点名称nodeValue
文档节点9#dement'元素大写字母的标签名称null
文本节点 3# 文本文字内容
评论节点8#评论评论内容

属性

  • [container].childNodes 获取包含容器内所有节点类型的节点集合
  • [container].children 仅获取元素
的节点集合

设置DOM元素自己的属性

[元素].xxx = xxx / 元素[xxx] = xxx

获取:[元素].xxx

删除:删除[元素].xxx

原理:堆内存操作

[元素].setAttribute('xxx', xxx)

获取:[element].getAttribute('xxx')

删除:[元素].removeAttribute('xxx')

原理:利用结构DOM进行操作

  • 操作 DOM 元素的样式

    • 嵌入样式:element.style.xxx
    • ie:element.currentStyle["height"]
    • 非ie:getComputedStyle(element).height

版权声明

本文仅代表作者观点,不代表Code前端网立场。
本文系作者Code前端网发表,如需转载,请注明页面地址。

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

热门