js的dom操作

照例，先来几句没怎么又用的话，

DOM是Document Object Model的缩写，dom是文档对象模型，这种模型是树模型；文档指标签文档；对象是指文档中的每个元素，模型则是抽象话的东西。

  说实话，dom不知道该在什么地方开始着手整理，下面这是基于讲义进行整理的

    一  window.open

      Window.open分为下面几个部分，

        1   写页面地址

        2 _back打开方式，是在新窗口还是在自身窗口

        3  控制打开窗口格式，可以写多个用空格隔开，如下 

          toolbar=no 新打开窗口没有工具条

          menubar=no 没有菜单栏  status=no 没有状态栏

          width height  宽度高度

          left=100  打开窗口距离左边的距离

          resizable-no 窗口大小不可调

         scrollbars=yes  出现滚动条

         location=yes 有地址栏。

    window.open也有返回值，他的返回值是新打开窗口对象，例如

        打开窗口：window.open(“Untitled-6.html”)

        把打开的窗口保存在变量中 var w=window.open（）

        如果打开的是多个窗口，则可以保存在数组中

         function open w （）{

        w [i++]=window.open() 

        }

    二window.close（）是关闭窗口和window.open（）相反

        关闭多个子窗口可以先将打开的窗口存在数组中，用循环将他们挨个关闭。

         关闭打开当前窗口的原窗口 window.opener.close()

     三 延迟和间隔

       间隔执行一段代码（函数）window.setInterval("要执行的代码"，时间间隔毫秒数)

       清除间隔执行 window.clearInterval（间隔的ID）

       延迟一段时间执行某一段代码（函数）：window.setTimeout("要执行的函数体"，延迟的毫秒数)

       清除延迟 window.clearTimeout（延迟的id），清除setTime

      四 调整页面

        window.navigate("url") 跳转至目标页面，在谷歌浏览器下有bug

        window.moveTo(x,y)移动页面至某一位置（IE专用）

        window.resizeTo(宽，高)   （ IE专用）

        window.scrollTo(x，y) 滚动页面至哪里，y表示纵向滚动

    五 模态对话框和非模态对话框

      模态对话框垄断了用户的输入。当一个模态对话框打开时，用户只能与该对话框进行交互，而其他用户界面对象收不到输入信息。模态对话框下，用户需要操作目标对话框就必       须先操作模态对话框。

         打开模态对话框 window.showModalDialog("url",“向目标对话框传的值”，“窗口特征参数”) 特征属性分号隔开，像素用px。dialogHeight dialogWidth center等

      非模态对话框则相反，当一个非模态对话框打开时，用户依然可以操作其他页面。

         打开非模态对话框 window.showModelessDialog("url","向目标对话框传的值","窗口特征属性")

      var a=window.dialogArgument，可以用一个参数来获取模态或非模态对话框传递的值

    六 window对象

        window.history对象

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

          window.history.forward; 页面前进

          window.history.go(n);  n如果是正数代表前进n个页面，n如果是负数，则代表后退几个页面（比较常用这一种）

        window.location对象

          loction 地址栏

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

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

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

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

       window.status对象

          status 状态栏，可以给状态栏添加要显示的文字

          window.status="要在状态栏显示的内容"；设置状态栏文字

       七  Window.document

           1 找到元素：

             document.getElementById("id") 根据id找，最多找一个

             document.getElementByName("name") 根据name找，找出来的是数组。

             document.getElementByTagName("name") 根据标签名找，找出来的是数组

             document.getElementByClassName("name")根据classname找，找出来的是数组

          1.1 非表单元素

            var a= document.getElementById("id") 

             a.innerHtml  标签里的html的代码和内容都会获取到

            a.innerText  只取里面的文字

            a.outHTML 包括标签本身的内容 （简单了解）

          2）设置内容

           a.innerHTML="<font color=red>你好</font>"    div中的内容被替换掉

            赋值个空字符串可以把内容清空。

          1.2表单元素

            1获取内容，有两种方式

              var a=document.f1.t1    form表单ID为f1里面的ID为t1的input； 或者var a=document.getElementByID("id"),直接用id获取

            a.value 获取input中的value值 

            2可以设置内容  a.value="内容改变"

            3 一个小知识点，<a href="www.baidu.com" onclick="return flase">转向百度</a> 加了return flase则不会跳转，默认是return true会跳转，如果按钮中设置看return flase则网页不会跳转。。

          1.3操作属性

          首先利用元素的ID找到该元素 存于一个变量中

           var a=document.getElementByID("id")

           然后可以对该元素的属性进行操作

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

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

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

        1.4操作样式

           首先利用元素的ID找到该元素 存于一个变量中

           var a=document.getElementByID("id")

          a.style.样式=“”   操作id的样式

        1.5相关元素操作　　

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

           var b= a. nextSibling 找到a的下一个同辈元素    注意空格

           var c = a. previousSibling 找到a的上一个同辈元素  注意空格

          var d = a.parentNode 找到a的上一级父辈元素

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

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

         alert（nodes[i] instanceof Text）判断是不是文本   是返回TRUE  不是返回flase   用if判断他的值是不是flase 可以去除空格

       1.6 元素的创建 添加和删除

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

        var obj=document.createElement("标签名") 创建一个元素     obj.innerHTML="hello world" 添加的时候首先要创建出一个元素

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

        a.moveChild(obj) 删除一个子元素

         列表中a.selectIndex： 选中第几个 a.options[a.selectIndex] 按下标取出第几个option对象

       1.7 字符串的操作

         var a = new String() 或者 var a ="sssss"

         var a ="hello"

         a.toLowerCase 转小写   a.toUpperCase( ) 转大写

         a.substring(2,3)从第二个位置截取到第三个位置

         a.substr(2,3)  从第二个位置开始截取后边的三个长度。不写后边的数字就截取到最后

         a.split('') 将字符按照指定字符拆开

         a.lenght  是属性

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

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

     1.8 时间操作

        var a=new Date()    当前时间

        var a = new Date(1999,3,2) 定义一个时间     1999,4,2   月份要加1

       a.getFullYear: 取年份 a.getMonth 取月份 取出的月份少1    a.getDate()取天 a.getDay 取星期几 a.getHours 取小时 a.getMinutes()  取分钟   a.getSeconds()取秒

       a.setFullYear  设置年份  设置月份的时候注意加1

     1.9 数学函数操作

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

       Math.floor  小于当前小数的最大整数

       Math.sqrt()  开平方

       Math.round()  四舍五入

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

   小知识点

      外面双引号   里面的双引号改为单引号

       在div里面行高和整个外面高度一样才能用竖直居中  居中是行居中

       文本框取出来的值是字符串      需要用  parseInt（）转化成数字

       a.match(reg)  s代表字符串   reg代表一个字符串  两者进行匹配    如果两个字串不匹配  返回   null