zoukankan      html  css  js  c++  java
  • BOM和DOM

    BOM 浏览器对象模型

    BOM中的对象

      Window对象:是指窗口对象,可通过Window对象的属性和方法控制窗口,例如打开或关闭一个窗口

      History对象:指历史页面,通过History对象的属性和方法实现前进后退的功能

      Location对象:指地址栏,通过属性的方法控制页面的跳转

      Document对象:指网页中的内容,通过属性和方法控制页面元素

    1、Window对象的常用方法:

      open();  close();  alert();  prompt();  confim();  setTimeout();  setTimeout();  setInterval();  clearInterval();

    2、History对象常用方法:

      window.history.back();页面进行后退;

      window.history.forward();页面前进;

      window.history.go(n); n如果是正数则代表前进n个页面,n如果是负数则代表后退n个页面,一般常用这一种。

    3、Location对象常用方法:

      var s = window.location.href;获取当前页面的地址

      window.location.href="http://www.baidu.com";修改页面地址,会跳转页面

      window.location.hostname: 主机名,域名,网站名,可用变量接收

      window.location.pathname: 路径名,可用变量接收

    4、Document对象常用方法:(重点)

        document.getElementById("id");根据id找,最多找到一个;

        document.getElementsByName("name");根据name找,返回数组

        document.getElementsByTagName("name");根据标签名找,例如<input>...返回数组

        write();打印内容

      4.1、常用操作:

          var a =document.getElementById("id");

         alert(a.innerText);只取里面的内容

         alert(a.outerHTML);包括标签本身的内容(简单了解)

         设置内容:a.innerHTML = "<font color=red >hello world </font>";

      4.2、操作属性      

         a.setAttribute("属性名","属性值"); 设置一个属性,添加或更改都可以;

         a.getAttribute("属性名");获取属性的值;

         a.removeAttribute("属性名");移除一个属性。

      4.3、操作样式

         document.body.style.backgroundColor="颜色"; 整个窗口的背景色

         a.className="样式表中的classname"

      4.4、相关元素操作

          var a = document.getElementById("id");找到a;

          var b = a.nextSibling,找a的下一个同辈元素,注意包含空格;

          var b = a.previousSibling,找a的上一个同辈元素,注意包含空格;

          var b = a.parentNode,找a的上一级父级元素;

          var b = a.childNodes,找出来的是数组,找a的下一级子元素;

          var b = a.firstChild,第一个子元素,lastChild最后一个,childNodes[n]找第几个;

          alert(nodes[i] instanceof Text); 判断是不是文本,是返回true,不是返回flase,用if判断它的值是不是false,可以去除空格。

      4.5、元素的创建、添加、删除

          var a = document.getElementById("id");找到a;

          var obj = document.createElement("标签名");创建一个元素

          obj.innerHTML = "hello world";添加的时候首先需要创建出一个元素。

          a.appendChild(obj);向a中添加一个子元素。

          a.removeChild(obj);删除一个子元素。

          列表中a.selectedIndex:选中的是第几个;

      4.6、字符串操作

          var s = new String(); 或var s ="aaaa";

          var s = "hello world";

          alert(s.toLowerCase());转小写 toUpperCase() 转大写

          alert(s.substring(3,8));从第三个位置截取到第八个位置

          alert(s.substr(3,8));从第三个位置开始截取,截取八个字符长度,不写后面的数字是截到最后.

          s.split('');将字符换按照指定的字符拆开,放入数组,自动排序

          s.length是属性

          s.indexOf("world");world在字符串中第一次出现的位置,没有返回-1

          s.lastIndexOf("o");o在字符串中最后一次出现的位置

      4.7、日期时间的操作

          var d = new Date();当前时间

          d.setFullYear(2015,11,6);/*在想要设置的月份上减1设置*/

          d.getFullYear:取年份;

           d.getMonth():取月份,取出来的少1;

          d.getDate():取天;

          d.getDay():取星期几

          d.getHours():取小时;

          d.getMinutes():取分钟;d.getSeconds():取秒

          d.setFullYear():设置年份,设置月份的时候注意-1。

      4.8、数学函数的操作

          Math.ceil();大于当前小数的最小整数

          Math.floor();小鱼当前小数的最大整数

          Math.sqrt();开平方

          Math.round();四舍五入

          Math.random();随机数,0-1之间



     

    DOM 文档对象模型

      DOM是针对XML的基于树的API。描述了处理网页内容的方法和接口,是HTML和XML的API,DOM把整个页面规划成由节点层级构成的文档。

      DOM本身是与语言无关的API,它并不与Java,JavaScript或其他语言绑定。

    特定语言的DOM

       针对XHTML和HTML的DOM。这个DOM定义了一个HTMLDocument和HTMLElement做为这种实现的基础。其他的包括SVG的DOM

  • 相关阅读:
    Android——DEBUG 堆栈
    mycat读写分离与主从切换
    【測试工具】一个将Unix时间转换为通用时间的工具
    jQuery:多个AJAX/JSON请求相应单个回调
    iOS开发中经常使用的Xcode插件
    JAVA学习第二十六课(多线程(五))- 多线程间的通信问题
    我的mac OSX bash_profile文件
    angular学习(二)—— Data Binding
    python 读取grib grib2
    linux获取内存、cpu、负载、网口流量、磁盘信息
  • 原文地址:https://www.cnblogs.com/yongjiapei/p/5472038.html
Copyright © 2011-2022 走看看