JavaScript学习笔记

1.JavaScript知识回顾

1)任何一个浏览器窗口，都可以由JS中的内置对象来表示，例如：窗口(window)，文档（document)，状态拦（status）

  2)定位表单的二种方式：

   1)document.forms[下标]，从0开始

   2)document.表单form的名字(提倡)

  3)同一个JS代码，可能在不同的浏览器中运行的效果，可能不一样。

  4)定义函数的三种方式：

   >>正常定义方法：

       functionadd(num1,num2){return num1+num2;}

 

   >>构造器方式：

       new Function("num1","num2","returnnum1+num2;")可以只有一个参数，该参数就是函数体，以字符串形式出现

 

   >>匿名函数方式(常用):

       function(){return "100+200";}

  5)DOM是Document(文档)Object(对象)Model(模型)的简称。

     文档：指html和xml

     对象：可以通过对象.方法()，或对象.属性的方式操作html和xml文档中的任何内容

     模式：任何一个文档在dom看来，都是一个倒状的树形结构

    DOM是垮浏览器，跨平台，跨语言的一个接口，实现类就是各种不同浏览器中的解析器。

    

   6)在dom看来，任何的文档，都是由节点组成，即一切都是节点(Element)。

 

2.DOM常用API

2.1定位某个节点(3种方式),通过id，属性名和标签名。

Id：document.getElementById("tid") 根据id获取指定节点的值，不存在时返回null。

 

属性名：document.getElementsByName("tname")根据属性name的值定位节点，返回数组，要迭代(遍历，循环)取出每一个节点。(注意是getElements，是复数)

 

标签名:document.getElementsByTagName("select") 根据标签名定位节点，返回数组, 要迭代(遍历，循环)取出每一个节点。(注意是getElements，是复数)

 

2.2判断某个节点是否有子节点

hasChildNodes() 返回布尔值

 

2.3 nodeName和nodeType和nodeValue：取得标签，属性，文本的名字，类型，和值。

l      nodeName:一个字符串，其内容是给定节点的名字。

  varname = node.nodeName;

   * 如果节点是元素节点，nodeName返回这个元素的名称

   * 如果是属性节点，nodeName返回这个属性的名称

   * 如果是文本节点，nodeName返回一个内容为#text 的字符串

注:nodeName 是一个只读属性。

 

l      nodeType：返回一个整数，这个数值代表着给定节点的类型。

•        nodeType 属性返回的整数值,常用的有三种：

•        Node.ELEMENT_NODE    ---1   -- 元素节点

•        Node.ATTRIBUTE_NODE  ---2   -- 属性节点

•        Node.TEXT_NODE       ---3   -- 文本节点

•        nodeType 是个只读属性

l      nodeValue：返回给定节点的当前值（字符串）

•         如果给定节点是一个属性节点，返回值是这个属性的值。

•         如果给定节点是一个文本节点，返回值是这个文本节点的内容。

•         如果给定节点是一个元素节点，返回值是null

•         nodeValue 是一个读/写 属性，但不能对元素节点的 nodeValue 属性设置值，

但可以为文本节点的 nodeValue 属性设置一个值。

 

2.4 replaceChild(新,旧)：用新节点替换已存在的旧节点，返回替换后的节点（新前旧后）

2.5 getAttributeNode()：返回属性节点，而不是属性值

2.6 getAttribute():返回属性的值

2.7 setAttribute():创建属性（如果还不存在），修改属性（如果已经存在了）

2.8 removeAttribute()：删除已存在的属性

2.9 createElement()创建元素,该方法只能在document对象上使用。

2.10 innerHTML为html标签中的内容设置值，但不是dom的标签，在xml文档中不能使用，只能在html中使用。

2.11 appendChild()向父节点添加子节点，添加的节点在父节点之后。

2.12 createTextNode()创建新文本节点，它是dom的标准方式，用来替换innerHTML属性。

2.13 insertBefore()：插入到某个节点之前，添加的节点在父节点之前。insertAfter()：插入到某个节点之后，添加的节点在父节点之后。

2.14 nextSibling()：定位下一个兄弟节点

2.15 childNodes：只能用在含有子元素的节点上，返回值包含空白字符。

2.16 length：取得数组的长度

2.17

firstChild       (第一子节点)

lastChild         (最后一个子节点)

nextSibling     (下一个兄弟节点)

previousSibling      (上一个兄弟节点)

parentNode     (父节点) 这些都是属性。

2.18模式窗口：打开新窗口后，只能在当前窗口中操作，不能在浏览器其它地方操作（除非关闭新窗口）。window.showModalDialog(sURL, vArguments, sFeatures)(注意是modal，是al结尾的)

 

     非模式窗口：打开新窗口后，不仅可以在当前窗口中操作，还能在浏览器其它地方操作。window.showModelessDialog(sURL, vArguments, sFeatures)(注意是modeless，是eless结尾的)

           <scripttype="text/javascript">

                //以模式和非模式方式打开窗口

                document.getElementsByTagName("input")[0].onclick =function() {

                     var sURL ="insertBefore_insertAfter.html";

                     var vArguments =null; //这个参数不需要用的时指定为null ,用户接收父窗口传过来的参数。

                     var sFeatures ="dialogHeight:200px;dialogWidth:150px";

//                  window.showModalDialog(sURL,vArguments, sFeatures); //显示模式窗口

                     window.showModelessDialog(sURL,vArguments, sFeatures); //显示非模式窗口

                }

           </script>