JavaScript
2021-03-09 20:00:58 0 举报AI智能生成
前端javaScript思维导图集锦，平时忘了的，或者想复习直接上手就成！
作者其他创作
大纲/内容
BOM浏览器对象模型
document
history
history.back()
history.forward()
history.length
history.go(n)
location
location.reload
location.assign("url")
location.href
location.hash
location.search
navigator
navigator.userAgent
screen
frames
字符串
String.indexOf(searchValue,start)
String.charAt(index)
String.substr(start,legth)
String.subString(from,to(不包括))
String.slice(start,end(不包括))
String.split(seperate,limit(字符串数组最大长度))
String.replace(searchValue,newValue)
String.valueOf()
String.trim()
String.toString()
String.charCodeAt(num1,num2,...,numX)
String.fromCharCode(n1,n2,...,nX)
String.concat(String1,String2,..,StringX)
String.includes(searchValue,start)
String.lastIndexOf(searchValue,start)
String.match(regexp)
String.repeat(count)
String.search(searchValue(字符串/正则表达式))
String.starWith(searchValue,start)
String.tolowerCae()
String.toUpperCase()
String.toLocaleLowerCase()
String.toLocaleUpperCase()
数组Array
arr.push(item1,item2....,itemN)
arr.pop()
arr.unshift(items1，items2，....,itemsN)
arr.shift()
arr.splice(index,howMany,items1,items2...itemsN)
arr.slice(start,end)
arr.sort(function(a,b){retrun a-b;})
arr.reverse()
arr.join(可选：separate(分隔符))
arr.toString()
arr.concat(array1,array2,...,arrayN)
arr.valueOf()
arr.indexOf(items,start(可选))
arr.lastIndexOf(items,start(可选))
arr.forEach(function(currentValue(必选),index,arr),thisValue)
arr.map(function(currentValue(必选)，index,arr),thisValue)
arr.filter(function(currentValue(必选),index,arr){},thisValue)
arr.some(function(currentValue(必选),index,arr){},thisValue)
arr.every(function(currentValue,index,arr){},thisValue)
arr.reduce(function(total,currentValue,currentIndex,arr){},initialValue)
arr.reduceRight(function(total,currentValue,index,arr){},initalValue)
JSON
JSON.parse()
JSON.Stringify()
正则表达式
| 表示或
[] 表示或
[^ ] 找除了。。。还是否有其它的东西
量词
字符串和正则相关方法
转义字符
\w表示任意的字母，数字 _
\W除了字母，数字 _
\d 任意数字
\D 除了数字
\s 空格
\S 除了空格，是否还有其他
\b 单词边界
\B 除了单词边界
DOM元素的操作
增
创建：createElement("标签名")
创建：createDocumentFragment()
创建：createTextNode("文本内容");
插入最后：dom（元素节点）.appendChild(对象/节点);
插入指定位置：insertBefore(newNode,existNode)
删
当前元素节点.remove()
父元素.removeChild(要删除的子元素)
改
outerHTM(返回包括标签的内容)
查
选择器
选择器
元素节点选择器
document.getElementById("id");
document.getElementsByClassName("class");
document.getElementsByTagName("tag");
document.getElementsByName("name");
querySelector("#id/.clas...")
querySelectorAll("css");
previousElementSibling
nextElementSibling
children
firstElementChild
lastElementChild
parentNode
其他节点选择器
返回值为单个对象
firstChild
lastChild
previousSibling
nextSibling
返回值为伪数组
childNodes
attributes
其他类型操作
样式操作
获取：getComputedStyle(对象，false（伪类）.样式名)
获取:元素.style.样式名（只能获取行内元素）
设置：元素.style.样式名=“属性值”；
容器尺寸类操作：
clientWidth(cont+padding)
offsetWidth(cont+padding+border)
scrollHight(cont+padding+可滚动区域)
offseTop/left(相对于包含块的位置)
offsetParent包含块
scrollTop滚动距离，既可获得又可以设置
属性操作
内置属性：可以用使用对象的操作语法来设置
自定义属性：get/set/removeAttribute()
事件
DOM Event
鼠标事件
click
dblclick
mousedown
mouseup
mousemove
mouseover
mouseout
键盘事件
keydown
keypress
keyup
表单事件
submit
blur
change
focus
select
事件属性
鼠标事件对象
e.offsetX/Y
e.clientX/Y
e.pageX/Y
e.button
e.type
e.target/e.srcElement
键盘事件对象
e.keyCode
e.which
e.ctrlKey
e.shiftKey
e.altKey
e.metaKey
获取时间对象
事件冒泡
默认事件
a标签
鼠标右击后出现的
表单的提交
表单的重置
事件的委托（代理）
d
收藏
0 条评论
下一页
