学习笔记_web——js特效2DOM

DOM模型
 Core DOM 正对任何结构化文档
 XML DOM  针对XML
 HTML DOM 针对HTML
 
使用DOM访问节点
 1、通过document对象
  getElementById()  通过ID获取第一个对象的应用
  getElementByName()  带有指定名称的对象集合
  getElementBytagName()  带有指定标签名的对象集
 2、通过层次关系
  parentNode 父节点
  firstChild 第一个子节点
  lastChild 最后一个子节点
  【这三个都是属性】
改变节点属性
 1、Core标准方法
  getAttribute(value);
  setAttribute(key , value);
 2、HTML针对方法
  对象名.属性名

改变节点
 createElement(tagNema)  创建一个元素
 appendChild(nodeName)  在末尾添加子?节点
 insertBefore(newNode, oldNode) 在某个元素前插入节点
 cloneNode(deep)   克隆节点
 remoreChild(node);  删除子节点

改变节点内容
 innerHTML   设置、获取元素内html
 innerText   设置、获取元素内内容


 HTML对表格的处理
 Table    表格
 TableCell   单元格
 TableRow   行
 rows[]    所有行
 cell[]    所有单元格

    例如:rows[] rows[0]表示第一行
 方法
  insertRow(index); 添加行
  deleteRow(index); 删除行

 TableRow
 属性
  cells[]   行中所有单元格
  rowIndex  行的索引(行数)
 方法
  insertCell()  添加单元格  
  deleteCell()  删除单元格

 TableCell
 属性
  cellIndex  返回单元格位置
  innerHTML  设置或返回单元格HTML
  className  设置或返回元素class

 

数组
  创建
    var name = new Array(size);
  赋值
    var name = new Array("xxx","yyy");
    name[i] = "xxxxxx";
 读取
  name[i]
  for
  for...in
  for...in 实例 name为数组
  for (var x in name) {
   ...
  }

 常用属性
     length 长度(设置为零则清空)
 常用方法
     join(String) 数组拼成字符串,用String连接
     sort()  对数组排序,根据编码

 

静态下拉菜单级联
 select对象
  属性
   options[] 选项数组
   建立options数组  new Options(显示文本 , 值);
   selectedIndex  被选中的索引号
   length   长度

  方法
   add(Option对象 , 位置)
  事件
   onchange

 

DOM和CSS交互
 className属性
    this(元素).className = "";
 style对象
    this(元素).style.属性 = "";

 显示隐藏
    styls.display属性 none  不显示
       block 显示
      也可以用css


 内部外样式
   内部样式
       style.left = "";注意,加减时需parseInt(),最后加"px"单位;
  外部样式
     IE: currentStyle
     其他 getCompteredStyle()
   例如:if(obj.currentStyle) --为IE
    obj.currentStyle.left
   else
    docunment.defaultView.getComputerStyle(obj , null).left;


 鼠标滚动
 属性
  docunment(有滚动条的).documentElement.scrollTop
  docunment(有滚动条的).documentElement.scrollLeft
 事件
  window.onscroll = 函数名


Js data对象的使用

Date 对象用于处理日期和时间。
创建 Date 对象的语法:
var myDate=new Date()
Date 对象会自动把当前日期和时间保存为其初始值。
参数形式有以下5种: 

   new Date("month dd,yyyy hh:mm:ss");
   new Date("month dd,yyyy");
   new Date(yyyy,mth,dd,hh,mm,ss);
   new Date(yyyy,mth,dd);
   new Date(ms);

注意最后一种形式,参数表示的是需要创建的时间和GMT时间1970年1月1日之间相差的毫秒数。各种函数的含义如下:

month:用英文表示月份名称,从January到December

mth:用整数表示月份,从(1月)到11(12月)

dd:表示一个月中的第几天,从1到31

yyyy:四位数表示的年份

hh:小时数,从0(午夜)到23(晚11点)

mm:分钟数,从0到59的整数

ss:秒数,从0到59的整数

ms:毫秒数,为大于等于0的整数

如:

new Date("January 12,2006 22:19:35");

new Date("January 12,2006");

new Date(2006,0,12,22,19,35);

new Date(2006,0,12);

new Date(1137075575000);

 

Date() 返回当日的日期和时间。
getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。
getMonth() 从 Date 对象返回月份 (0 ~ 11)。
getFullYear() 从 Date 对象以四位数字返回年份。
getYear() 请使用 getFullYear() 方法代替。
getHours() 返回 Date 对象的小时 (0 ~ 23)。
getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。
getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。
getMilliseconds() 返回 Date 对象的毫秒(0 ~ 999)。
getTime() 返回 1970 年 1 月 1 日至今的毫秒数。
getTimezoneOffset() 返回本地时间与格林威治标准时间 (GMT) 的分钟差。
getUTCDate() 根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
getUTCDay() 根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
getUTCMonth() 根据世界时从 Date 对象返回月份 (0 ~ 11)。
getUTCFullYear() 根据世界时从 Date 对象返回四位数的年份。
getUTCHours() 根据世界时返回 Date 对象的小时 (0 ~ 23)。
getUTCMinutes() 根据世界时返回 Date 对象的分钟 (0 ~ 59)。
getUTCSeconds() 根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
getUTCMilliseconds() 根据世界时返回 Date 对象的毫秒(0 ~ 999)。
parse() 返回1970年1月1日午夜到指定日期(字符串)的毫秒数。
setDate() 设置 Date 对象中月的某一天 (1 ~ 31)。
setMonth() 设置 Date 对象中月份 (0 ~ 11)。
setFullYear() 设置 Date 对象中的年份(四位数字)。
setYear() 请使用 setFullYear() 方法代替。
setHours() 设置 Date 对象中的小时 (0 ~ 23)。
setMinutes() 设置 Date 对象中的分钟 (0 ~ 59)。
setSeconds() 设置 Date 对象中的秒钟 (0 ~ 59)。
setMilliseconds() 设置 Date 对象中的毫秒 (0 ~ 999)。
setTime() 以毫秒设置 Date 对象。
setUTCDate() 根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
setUTCMonth() 根据世界时设置 Date 对象中的月份 (0 ~ 11)。
setUTCFullYear() 根据世界时设置 Date 对象中的年份(四位数字)。
setUTCHours() 根据世界时设置 Date 对象中的小时 (0 ~ 23)。
setUTCMinutes() 根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
setUTCSeconds() 根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。
setUTCMilliseconds() 根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
toSource() 返回该对象的源代码。
toString() 把 Date 对象转换为字符串。
toTimeString() 把 Date 对象的时间部分转换为字符串。
toDateString() 把 Date 对象的日期部分转换为字符串。
toGMTString() 请使用 toUTCString() 方法代替。 1 3
toUTCString() 根据世界时,把 Date 对象转换为字符串。 
toLocaleString() 根据本地时间格式,把 Date 对象转换为字符串。
toLocaleTimeString() 根据本地时间格式,把 Date 对象的时间部分转换为字符串。
toLocaleDateString() 根据本地时间格式,把 Date 对象的日期部分转换为字符串。
UTC() 根据世界时返回 1997 年 1 月 1 日 到指定日期的毫秒数。
valueOf() 返回 Date 对象的原始值。
var objDate=new Date([arguments list]);

学习笔记_web——js特效2DOM,布布扣,bubuko.com

学习笔记_web——js特效2DOM

上一篇:海量WEB日志分析


下一篇:Web 漏洞分析与防御之 CSRF(二)