javascript(操作BOM对象)

javascript与浏览器的关系?

javascript诞生就是为了能够让他在浏览器中运行

BOM:浏览器对象模型

·IE 6~11

·Chrome

·Safari

·FireFox

三方

QQ浏览器

360浏览器

Window

window代表浏览器窗口

window.alert(1)

window.innerHeighr

Navigator

Navigator封装了浏览器的信息

navigator.appName

大多数不会用navigator对象,会被人修改

screen(代表屏幕的尺寸)

screen.width
screen.heigth

location(主要)

location代表当前网页的URL的信息

host:

href:

protocol(协议):"https:"

reload:f reload()//刷新网页

document

document代表当前的页面,

document.title

document.title='~~~'

history:代表浏览器的历史记录

history.back()//后退

history.forward()//前进

操作DOM对象(重点)

核心

浏览器网页就是一个DOM树形结构

  ·更新:更新dom节点

javascript(操作BOM对象)

 

 

 操作文本

      ·id1.innerText=’456' 修改文本的值

     ·id.innerHTML=’<strong>123<strong>'

  操作js

 id1.style.color=’red‘

id1.style.fontSize=’20px‘//驼峰命名法

    ·遍历dom节点:得到Dom节点

    ·删除:删除一个Dom节点

   删除节点的步骤:先获取父节点,在通过父节点删除自己

javascript(操作BOM对象)

 

 

 

 p1.parentElement()//获取父类节点

    ·添加:添加Dom节点

 

javascript(操作BOM对象)

 

 

 

创建一个标签,插入
<script>
var
js =document.getElementById('js'),//已经存在的节点
list=document.getElementById('list');
list.appendChild(js);//追加到后面
//通过JS创建一个新的节点
var newP = document.createElement('p');//创建一个p标签
newP.id='newP';
newP.innerText='hello';
</script>

 

 

 

 

要操作一个节点,必须先获得这个节点

获得dom节点

javascript(操作BOM对象)

 

上一篇:【Java】【IDE】IntelliJ Idea出现非法字符【\ufeff】错误


下一篇:JavaScript从放弃到入门(四)| JS操作BOM