标签:
通过W3C提出的文档对象模型DOM,让我们可以通过JavaScript,以编程的方式控制网页上的所有元素及属性.JavaScript中的大部分处理DOM的过程都利用document对象.下面简单介绍一下相关的内容.
节点类型:
childNodes:子节点
parentNode:父节点
firstChild:第一个子节点
lastChild:最后一个子节点
nextSibing:相邻的节点
previousSibing:上一个节点
除了父节点意外,以上的其他节点均存在兼容性问题,要特别注意.
获取节点以及节点的操作:
创建节点:
var div1=document.createElement("div")
创建文本节点:
var b=document.createTextNode("跳转")
添加节点到最后:
wrap.appendChild(div)
设置节点属性:
wrap.setAttribute("href","路径")
插入节点:
insertBefore(要插入的对象,插入...之前).
删除节点:
wrap.removeChild(div),div=null
替换:
wrap.replaceChild(span,a)(用span替换a
代码示例:
var input=document.createElement("input"); input.setAttribute("type","button"); input.setAttribute("value","关闭"); input.setAttribute("style","float:right"); div.appendChild(input); wrap.appendChild(div);
表单的引用:
获取表单的方法:
1.document.froms[0]
2.document.froms["name值"]
3.document.forms.name值
4.document.name值
表单内元素的引用:
获取方式:
1.document.name值.elements[0];
2.document.name值.elements["name值"]
3.document.name值.elements.name值
4..document.name值.name值
表单的启用设置:
document.form1.name值.disabled=true(不可改,不启用)
输出对象存在的表单:
document.form1.name值.form
示例:
//获取焦点的方法 document.form1.xingming.onfocus=function(){ document.form1.xingming.value=""; }; //失去焦点的方法 document.form1.xingming.onblur=function(){ //值存在的情况 if(document.form1.xingming.value){ return 0; }else{ document.form1.xingming.value="请输入"; } }; // 提交的函数 function chek(){ // if(document.form1.xingming.value.trim()==""){ // document.form1.xingming.style.border="1px solid red"; // return false; // } //// 性别的判断 var sta=false; for (var i=0;i<document.form1.sex.length;i++){ if(document.form1.sex[i].checked){ sta=true; } } if(!sta){ return false; } // 复选框 var tre=false; for (var i=0;i<document.form1.yundong.length;i++){ if(document.form1.yundong[i].checked){ tre=true; } } if(!tre){ return false; } }
标签:
原文地址:http://www.cnblogs.com/hongxuejiao/p/4805124.html