1.什么是BOM,什么是DOM(基本概念)

BOM:  Browers Object MOdel           浏览器对象模型  

DOM:  Document Object MOdel        文档对象模型

2.深入理解BOM与DOM

  a.BOM与DOM可以理解为一个接口

   BOM:让我们使用编程语言控制浏览器行为(跳转,前进,后退,获取屏幕大小 等);

   DOM:让我们使用编程语言操作HTML内容(添加元素,修改元素,删除元素);

  b.BOM没有相关标准,DOM遵循W3C

  c.BOM的根本对象为Windows,DOM根本对象是document (windows.document)

  d.BOM与DOM的关系

   

3.BOM和DOM对象用法小总结

  a.windows

    windows.moveTo(100,100);    //移动到指定坐标(针对左上角)

    windows.moveBy(100,200);    //移动指定像素(针对初始位置)

    windows.resizeTo(300,300);      //将窗口调整为指定宽高

  b.location

    location.protocal    //返回url协议

    location.host       //返回当前url的主机名和端口号(www.xxx.com)

    location.hostname   //返回当前url的主机名(xxx.com)

    location.port       //返回当前url的端口部分(若为默认的80则无返回)

    location.href       //跳转

  c.navigator

    navigator.userAgent  //声明浏览器用于HTTP请求的用户代理头的值

    重点:利用该属性判断用户使用的是pc还是mobile   

 <script>
function isMobile() {
var ua = navigator.userAgent;
if(ua.indexOf("Mobile") != -1){
return true;
}
return false;
}
if( isMobile() ){
location.href = 'http://www.cnblogs.com/paradise-zzz/'
}else {
alert("请使用手机浏览!");
}
</script>

  d.node

    nodeType          //返回节点类型(元素节点1,属性节点2)

    childNodes        //返回子节点集合

    children          //非标准属性返回指定元素子节点集合(只返回html节点,不返回文本节点,通常和innerHtml结合使用  ps:返回注释节点)

    firstChild         //返回首个子节点

    nextSibling        //返回该元素节点的下一个兄弟节点(中间不能有空格,因为空格被算作文本节点  ps:回车也不行)

    nextElementSibling     //返回该元素节点的下一个元素兄弟节点(这个可以有空格回车什么的)

    appendChild()       //添加(从列表尾部开始)

    insertBefore()        //添加(从列表头部开始)

    removeChild()       //删除

    replaceChild(new,old)      //替换

关于DOM与BOM的总结的更多相关文章

  1. javascript、ECMAScript、DOM、BOM关系

    ECMAScript,正式名称为 ECMA 262 和 ISO/IEC 16262,是宿主环境中脚本语言的国际 Web 标准. ECMAScript 规范定义了一种脚本语言实现应该包含的内容:但是,因 ...

  2. 理清javascript的相关概念 DOM和BOM

    javascript 有三部分构成,ECMAScript,DOM和BOM,根据宿主(浏览器)的不同,具体的表现形式也不尽相同,ie和其他的浏览器风格迥异.JavaScript=语法+BOM(含DOM) ...

  3. JavaScript---网络编程(6)-Dom和Bom模型概念讲解(节点获取,window对象)

    本节讲Dom和Bom模型概念讲解(节点获取,window对象). out.js: 写了2个输出到页面的函数. function println(param){ document.write(param ...

  4. 第六十九天 dom与bom

    1.节点 dom与bom属 // DOM:文档对象模型 =>提高给用户操作document obj的标准接口 // DOM:以document为根,树状展开所有子节点 节点分类 // 节点分类: ...

  5. 【JavaScript】DOM和BOM之我的理解

    2018年12月17日 一.我们能够对html文档和浏览器做的操作 (一)html文档 增.删.改.可以在html中增加.删除.改动元素 (二)浏览器 地址栏:输入.修改地址 历史记录:前进.后退.跳 ...

  6. 前端基础之DOM和BOM

    前端基础之DOM和BOM JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏 ...

  7. Javascript的组成——EMACScript、DOM、BOM

    EMACScript:一种规范,JS必须准守它的约定,JS的核心. DOM:文档对象模型,W3C标准,JS访问HTML文档的接口. BOM:浏览器对象模型,没有统一的标准.JS访问浏览器的接口. EM ...

  8. ECMAscript,DOM,BOM哪个比较重要

    ECMA > DOM > BOM ECMA是JS的核心,语法.变量.对象.各种对象的API.作用域.原型链.闭包.This指向.构造函数等等必须要熟练,有了这些基础你才能去熟练的操作DOM ...

  9. day 52 js学习 DOM 和BOM

    前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我们需要继续学习BOM和DO ...

  10. DOM 和 BOM

    DOM 和  BOM DOM: DOM= Document Object Model,文档对象模型,DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构.换句话说,这是表示和处理一个H ...

随机推荐

  1. centos利用yum安装卸载软件常用命令

    来自:http://tech.v01.cn/Linuxchangjianwenti/changyongruanjiananzhuangyucao/2012/0119/70.html 一.使用yum安装 ...

  2. python3 第一章 - 简介

    1.什么是python 引用官方的话:Python是一种易于学习,强大的编程语言.它具有高效的高级数据结构,并通过简单而有效的方法来进行面向对象编程.Python的优雅语法和动态类型,以及其解释性质, ...

  3. linux如何自动获取ip地址

    第一步:激活网卡 系统装好后默认的网卡是eth0,用下面的命令将这块网卡激活. # ifconfig eth0 up 第二步:设置网卡进入系统时启动 想要每次开机就可以自动获取IP地址上网,就要设置网 ...

  4. jdk源码->集合->HashSet

    类的属性 public class HashSet<E> extends AbstractSet<E> implements Set<E>, Cloneable, ...

  5. 通过编程为Outlook 2007添加邮件规则

    Outlook 所支持的邮件规则相当有用,我们经常需要针对某些特征的邮件做特殊的处理.例如将其移动到某个特定文件夹,或者删除它等等. Outlook所支持的邮件规则主要两大类:收到邮件时和发送邮件时 ...

  6. 网卡bond技术

    概览: 目前网卡绑定mode共有七种(0~6)bond0.bond1.bond2.bond3.bond4.bond5.bond6 常用的有三种: mode=0:平衡负载模式,有自动备援,但需要&quo ...

  7. linux上的用户管理

    作为一个专业的服务器发行版,CentOS上存在着n多个用户,作为一个专业的运维工程师,linux的用户管理和用户组的管理是做为一个SA必不可少的工作. 下面我们就先来谈谈linux中的用户管理: us ...

  8. wpf动画同步闪烁

    public class BlinkAnimation : Animatable { /// <summary> /// 单例,保持所有闪烁的动画同步 /// </summary&g ...

  9. rsync推送和拉取

    rsync格式: # 拷贝本地文件.当SRC和DES路径信息都不包含有单个冒号":"分隔符时就启动这种工作模式.如:rsync -a /data /backup rsync [OP ...

  10. Spring整合JMS(四)——事务管理

    原文链接:http://haohaoxuexi.iteye.com/blog/1983532 Spring提供了一个JmsTransactionManager用于对JMS ConnectionFact ...