• 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

  • 相关阅读:
    power designer 绘制E-R 图
    git 的证书重新设置,以及如何让git 记住提交的用户名和密码
    weblogic的安装和注意的问题以及在idea怎么用weblogic启动一个web服务
    java的URI和URL到底是什么
    怎么把centos虚拟机zip文件导入vm虚拟机中
    gogole调试请求体的数据怎么知道
    Javascript数据类型——number类型
    Javascript类型——boolean类型
    Javascript数据类型——undefined和null的异同
    第3章,基本概念
  • 原文地址:https://www.cnblogs.com/naqiang/p/5489418.html
Copyright © 2020-2023  润新知