BOM Browser Object Model(文档对象模型)
> window对象
1、alert 弹出带有提示和一个确认按钮的警示框
2、confirm 弹出带有一个提示和一个确认按钮一个取消按钮的对话框
3、promt 弹出提示用户输入的对话框
>计时器
每隔一会儿就会执行一次某个动作
设置计时器 setInterval(fun,time)
取消计时器 clearInterval(id)
>跳转
location.href #获取当前网页的url
location.search #获取url的数据部分,即?号后面的内容
location.href = url #跳到指定的url去 (url不能省略协议名)
DOM Document Object Model(文档对象模型)
> dom树结构
> dom对象
主要是两种: document对象(文档对象)和element对象(元素对象)
> 查找标签
两种方式:
1、直接查找 根据id、class、标签名、自定义名 来查找
主要方法
document.getElementById() #通过id查找,得到一个元素对象
document.getElementsByClassName() #通过类名查找,得到一个元素对象数组
document.getElementsByTagName() #通过标签名查找,得到一个元素对象数组
document.getElementsByName() #通过自定义名查找,得到一个元素对象数组
2、导航查找
通过一个已定位的元素的查找其他元素
nextElementSibling #下一个兄弟节点标签
previousElementSibling #上一个兄弟节点标签
children #儿子节点标签
firstElementChild #第一个儿子节点标签
lastElementchild #最后一个儿子节点标签
>事件绑定
ele.on事件 = function(){ }
>文本操作
1、获取文本
ele.innerHTML #文本和标签都能取到
ele.innerText #只取文本
2、赋值文本
ele.innerHTML="<a href=' ' >123</a>" # 赋的值可以作为标签处理
ele.innerText = "<a href=' ' >123</a>" #赋的值只作为纯文本处理
>属性操作
ele.setAttribute() #设置一个属性
ele.getAttribute() #拿一个属性的值
ele.removeAttribute() #移除一个属性
>class属性操作
ele.classList.add() #ele标签中class属性添加一个值
ele.classList.remove() #ele标签中class属性移除一个值
>css操作
通过调style
ele.style.color = 'red'
ele.style.fontSize = '32px'