js中常用方法整理

news/2025/2/21 9:53:58

数据类型

typeOf()Number()parseInt()parseFloat()- * / %
检测数据类型转换为数字转换为整数类型转换为浮点类型非加法的数字运算
toString()+Boolean()String()
转换为字符串,不能转换undefined/null字符串拼接转换为布尔类型转换为字符串、所有内容都能转换

类型转换

typeof()isNaN()Number.isNaNObject.is()
检测数据类型检测是否为非数组检测是否为NaN判断两个值是否相等

数组

push()pop()unshift()shift()reverse()
像数组后面追加数据删除数组最后一个数据像数组前面追加一个数据删除数组第一个数据对数据进行翻转
sort()splice()concat()join()slice()
对数组进行排列截取数组的内容,并且可以在截取的位置放数据向数组添加数据,或者拼接数组使用连接符,将数组的数据连成字符串截取数组,但是不改变原数组
indexOf()lastIndexOf()forEachmapfilter
从前往后检索第一次出现内容的索引,无返回-1从后往前检索第一次出现内容的索引,无返回-1对数组进行遍历,不返回数据对数组进行加工,返回加工完的数组对数据进行过滤,返回过滤完的数据
findfindIndexeverysomereduce
在数据中内查找满足条件的第一项在数组中内查找满足第一项的索引判断数组中时候每一个都符合条件,符合返回true,反之判断数组中有一个满足条件就返回true对数组进行叠加

数字常用方法

random()round()ceil()floorabspowsqrtmax
生出随机数四舍五入向上取整向下取整绝对值幂运算平方根最大值
minPI
最小值圆周率

字符串常用方法

charAt()charCodeAt()toUpperCase()toLowerCase()substr()substring()
返回该索引位置的字符返回该索引位置的字符编码转换为大写转换为小写分割字符串分割字符串
slice()split()concat()indexOf()lastIndexOf()includes()
分割字符串按照分隔符分开转为数组对字符串进行拼接返回字符串第一个出现的下标返回字符串最后一个出现第一个的下标判断里面包含这个数据返回布尔值
startsWith()endsWith()trim()trimStart/trimLefttrimEnd/trimRightreplace
验证字符串是否以数据开头的验证字符串是否以数据结尾取出字符串左右两边的空格去除左面的的空格去除右面的的空格替换

时间对象

getFullYear()getMonth()getDate()getHours()getMinutesgetSecondsgetMillseconds
获取年份获取月份获取日获取小时获取分钟获取秒获取毫秒
getDaygetTime()setFullYearsetMounthsetDatesetHourssetMinutes
获取星期获取时间戳设置年份设置月份设置日设置小时设置分钟
setSecondssetMillisecondssetDaysetTime()
设置秒设置毫秒设置日期设置时间戳

BOM

window.alert('')window.prompt()window.confim()window.onload = function(){}
提示框输入框询问框当页面加载完之后调用
window.resize=function{}winodw.scroll = function(){}window.location.hrefwindow.location.reload()
当页面可视化窗口改变当滚轮滑动的时候获取网址或者跳转对页面进行重新加载
window.open('')winodw.close()document.documentElment.scrollTopdocument.body.scrollTop
打开一个新的页面关闭此页面浏览器卷出去的高度浏览器卷出去的宽度
window.history.back()window.history.forward()window.history.go(参数)window.scrollTo(x,y)
浏览器回退浏览器前进浏览器跳转浏览器滚动到
window.scrollTo({top,left,behavior})
浏览器滚动到:behavior怎么滑动

storage存储和cookie

localStorage存储sessionStorage存储cookie存储(过期时间必须调整8小时)
window.localStorage.setItem(key,value)window.sessionStorage.setItem(key)document.cookie = 'key=value;expire:'
window.localStorage.removeItem(key)window.sessionStorage.remove(key)
清除window.localStorage.clear()window.sessionStorage.clear()
window.localStorage.getItem(key)window.sessionStorage.getItem(key)console.log(document.cookie)

       

DOM

document.documentElementdocument.bodydocument.headdocument.getElementById()
获取html获取body获取head根据id来获取元素
document.getElementsByClassName()

document.getElements

ByTagClassName

document.querySelector('')document.querySelectorAll('')
根据类名返回一个伪数组根据标签返回一个伪数组根据选择器获取第一个元素根据选择器获取所有的元素
ele.id = 'asd'ele.setAttribute('aa','bb')ele.removeAttribute('aa')ele.getAttribute('aa')
原生属性直接使用属性名操作设置自定义属性删除自定义属性查询自定义属性
ele.dataset.aaa = 'zzzz'ele.dataset.aaadelete ele.dataset.aaaele.className
设置H5自定义属性

获取H5自定义属性

删除H5自定义属性获取元素的类名
ele.classListele.classList.add('类名')ele.classList.remove('类名')ele.classList.toggle('类名')
获取元素的所有类名返回数组添加类名删除类名切换,如果原来有那么删除,没有的话就添加
ele.innerHTMLele.innerTextele.valueele.offsetWidth
在元素上写,可以写超文本在元素上写,不能识别超文本用来操作表单,获取值获取元素的宽度包括border
ele.offsetHeightele.clientWidthele.clientHeightele.offsetTop
获取元素的高度包括border获取元素宽度不包括boder获取元素宽度不包括boder获取元素垂直父级距离
ele.offsetLeftele.offsetTopele.clientLeftele.clientTop
获取元素水平父级距离获取boder获取左boder的宽度获取上boder的宽度

        

BOM节点

元素.chlidNodes元素.children元素.firstChild()元素.lastChild()
获取元素的所有子一级节点获取元素的所有子一级元素节点获取元素的的第一个节点获取元素的最后一个节点
元素.firstElementChild()元素.lastElementChild()元素.previousSibling()元素.previousElementSibling
获取元素的第一个元素节点获取元素的最后一个元素节点获取元素上一个兄弟节点获取元素上一个兄弟元素节点
元素.nextSibling()元素.nextElementSibling()元素.parentNode元素.parentElement
获取元素下一个兄弟节点获取元素下一个兄弟元素节点获取元素的父节点获取元素的父节点
元素.attributesdocument.createElement('li')document.createTextNode('文本内容')元素.appendChild(节点)
获取该节点的所有属性创建节点创建文本节点像元素插入节点
元素.insertBefore(节点,谁的前面)元素.removeChild(子节点)元素.remove()元素.replaceChild(换上,换下)
像元素前面插入节点删除父元素中的子节点删除该元素使用换上节点替换点换下节点
元素.cloneNode()元素.nodeType()元素.nodeName()元素.nodeValue()
把元素克隆一个一模一样的元素属性获取节点的名称获取节点中的内容

获取浏览器的可视窗口大小

BOM层次获取Widthwindow.innerWidth(包括滚动条)
BOM层次获取Heightwindow.innerHeight(包括滚动条)
DOM层次获取Widthdocument.documentElement.clientWidth
DOM层次获取Heightdocument.documentElement.clientHeight


http://www.niftyadmin.cn/n/5860646.html

相关文章

OpenCV二值化处理

1.1. 为什么需要二值化操作 二值化操作将灰度图像转换为黑白图像,即将图像中的像素值分为两类:前景(通常为白色,值为 255)和背景(通常为黑色,值为 0)。二值化的主要目的是简化图像&…

lab4 CSAPP:Cachelab

写在前面 最简单的一集 实验室分为两个部分。在A部分中,实现一个缓存模拟器。在B部分中,编写一个矩阵针对高速缓存性能优化的转置功能。 感觉是比较经典的问题,之前在体系结构的课程中接触过,终于能通过lab实操一下了。 实验目…

tomcat中如何配置,可以支持域名访问

tomcat中如何配置,可以支持域名访问 在Tomcat中配置以支持域名访问,主要涉及到两个方面:配置Tomcat的server.xml文件和在Tomcat的conf目录下的Catalina目录中为每个域名或上下文配置context.xml文件。下面将详细介绍如何进行这些配置。 修改server.xml…

基于契约理论的竞争性组织数据共享安全激励机制matlab模拟与仿真

目录 1.程序功能描述 2.测试软件版本以及运行结果展示 3.核心程序 4.本算法原理 5.完整程序 1.程序功能描述 参考论文《A Secure Incentive Mechanism for Competitive Organization Data Sharing: A Contract Theoretic Approach》。信息技术发展使数据驱动的智能服务兴起…

【MySQL】索引和视图

索引 索引定义 索引是在数据库表的字段上添加的,是为了提高查询效率存在的一种机制。一个字段可以添加一个索引,多个字段联合起来也可以添加索引。MySQL查询主要为两种方式:索引检索和全表扫描。如果条件中包含某个字段,而该字段…

android调用ffmpeg解析rtsp协议的视频流

文章目录 一、背景二、解析rtsp数据1、C层功能代码2、jni层的定义3、app层的调用 三、源码下载 一、背景 本demo主要介绍android调用ffmpeg中的接口解析rtsp协议的视频流(不解析音频),得到yuv数据,把yuv转bitmap在android设备上显…

DeepSeek智能测试助手:分类+推理+导出一站式工具

前言 测试开发工程师在日常工作中需要处理大量测试文档,并且这些文档需要被高效分类、清洗和管理,同时结合强大的 AI 推理能力(如 DeepSeek 模型)进行智能化处理和分析。为此,我们开发了一款基于 PyQt5 的 GUI 工具&a…

钉钉多维表:数据管理与协作的新篇章

在当今数字化时代,数据的高效管理和团队协作已成为企业竞争力的关键因素之一。钉钉多维表,作为一款基于钉钉平台的数据协作管理工具,正以其独特的功能和优势,引领着数据管理与协作的新潮流。本文将为您全面解析钉钉多维表的定义、特点、功能亮点、应用场景以及如何使用,让您轻松…