BOM:Browser Object Model是指浏览器对象模型，它使JavaScript有能力与浏览器进行对话
DOM:Document Object Model是指文档对象模型，通过它可以访问HTML文档的所有元素
Window对象
所有浏览器都支持window对象，它表示浏览器窗口
一些常用的window方法
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
window.open() - 打开新窗口
window.close() - 关闭当前窗口
window的子对象
navigator对象 浏览器对象，通过这个对象可以判定用户所使用的浏览器，包含了浏览器相关信息 navigator.appName - Web浏览器全称 navigator.appVersion - Web浏览器厂商和版本的详细字符串 navigator.userAent - 客户端绝大部分信息 navigator.platform - 浏览器运行所在的操作系统 screen对象 屏幕对象 screen.availWidth - 可用的屏幕宽度 screen.availHeight - 可用的屏幕高度 history对象 浏览历史对象 history.forward() - 前进一页 history.back() - 后退一页 location对象 用于获取当前页面的地址，并把浏览器重定向到新的页面 location.href - 获取URl location.href = "URL" - 跳转到指定页面 location.reload() - 重新加载页面警告框：
警告框：alert
确认框：confirm
提示框：prompt
计时相关
setTimeout()：指定时间之后执行 语法：var t = setTimeout("JS语句",毫秒); clearTimeout() 语法：clearTimeout() setInterval()：按照指定周期执行 语法：setInterval("JS语句","毫秒"); clearInterval() 语法：clearInterval()
DOM
查找标签
直接查找 document.getElementById - 根据id获取标签 document.getElementByClassName - 根据class属性获取 document.getElementByTagName - 根据标签名获取标签集合 间接查找 parentElement - 父节点标签元素
children - 所有子标签
firstElementChild - 第一个子标签
lastElementChild - 最后一个子标签
nextElementSibling - 下个兄弟标签
previousElementSibling - 上一个兄弟标签
节点操作
创建节点
语法：createElement(标签名)
增加节点
语法：appendChild(节点名)
insertBefore(节点名,某个节点)
删除节点
语法：removeChild(节点名)
替换节点
语法：replaceChild(节点名，某个节点）
属性节点
innerText
innerHTML
attribute操作，增加特殊的属性
自带属性还可以直接点属性来设置
获取值操作
.value
适用于input，select，textarea
class操作
className - 获取所有样式类名
classList.remove() - 删除指定类
classlist.add() - 添加类
classlist.contains() - 判断类是否存在
classList.toggle() - 类存在就删除，不存在就添加
指定CSS操作
obj.style + CSS属性
事件
常用事件
onclick - 当用户点击某个对象时调用事件
ondblclick - 当用户双击某个对象调用事件
onfocus - 元素获得焦点
onblur - 元素失去焦点
onchange - 域的内容改变
onkeydown - 某个键盘按键被按下
onkeypress - 某个键盘按键被按下并松开
onkeyup - 某个键盘被松开
onload - 一张页面或一方图像完成加载
onmousedown - 鼠标按钮被按下
onmousemove - 鼠标被移动
onmouseout - 鼠标从某个元素移开
onmouseover - 鼠标移到某个元素之上
onselect - 在文本框中的文本被选中时发生
onsubmit - 确认按钮被点击，使用的对象时form
绑定方式
方式一：
<div id = "d1" onclick="changeColor(this);">点击</div>
<script>
function changeColor(ths){
ths.style.backgroundColor="green";
}
</script>
方式二：
<div id="d2">点击</div>
<script>
var divEle2 = document.getElementById("d2");
divEle2.onclick = function () {
this.innerText="heh";
}
</script>
window.onload
等待视图加载完成
https://www.cnblogs.com/Dominic-Ji/p/9121560.html
jQuery入门
jQuery是一个轻量级的，兼容多浏览器的JavaScript库
jQuery基础语法
$().action()
查找标签
基本选择器
id选择器 $("#id")
标签选择器 $("标签名")
class选择器 $(".className")
配合使用 $("div.c1") 找到有c1 class类的div标签
所有元素选择器 $("*")
组合选择器 $("#id,.classname,tagName")
层级选择器
$("x y"); x的所有后代y
$("x > y"); x的所有儿子y
$("x + y"); 找到随意紧挨在x后面的y
$(:x ~ y"); x之后所有的兄弟y
基本筛选器
:first 第一个
:last 最后一个
:eq(index) 索引等于index的元素
:even 匹配所有索引为偶数的元素
:odd 匹配所有索引为奇数的元素
:gt(index) 匹配所有索引大于index的元素
:lt(index) 匹配所有索引小于index的元素
:not() 移除所有满足not条件的标签
:has() 选取所有包含一个或多个标签在其内的标签
属性选择器
[属性]
[属性等于某个值]
[属性不等于某个值]
表单选择器
：text
：password
：file
：radio
：checkbox
：submit
：reset
：button
表单对象属性
：enabled
：disabled
：checked
：selected
筛选器方法
下一个元素
$("#id").next()
$("#id").nextAll()
$("#id").nextUntil("#i2")
上一个元素
$("#id").prev()
$("#id").prevAll()
$("#id").prevUntil("#i2")
父元素
$("#id").parent()
$("#id").parents()
$("#id").parentsUntil()
儿子和兄弟元素
$("#id").children();
$("#id").siblings();
查找：$("div").find("p")
筛选：$("div").filter(".c1")
.first() 获取匹配的第一个元素
.last() 获取匹配的最后一个元素
.not() 从匹配元素的集合中删除域指定表达式匹配的元素
.has() 保留包含特定后代元素，去除那些不含有指定的后代元素
.eq() 所有等于指定的元素
https://www.cnblogs.com/Dominic-Ji/p/10490669.html?tdsourcetag=s_pctim_aiomsg