我的目的是提交表单,js校验时,在输入框后面提示错误信息
如下,红色字体节点为js动态创建的
<p>
<input id="name" name="name" /><font class="red">error_msg</font>
<p>
function showErrmsg(msg,id){
var lo=document.getElementById(id);
var p=lo.parentNode;
if(p.lastChild!=lo){
p.removeChild(p.lastChild);
}
if(msg!=""){
if(p.lastChild==lo){
var font=document.createElement("span");
font.className="red";
font.innerHTML=msg;
p.appendChild(font);
return false;
}
}else{
return true;
}
}
有错误信息时,自动创建节点。没有则删除之前自动创建的节点。
这里把输入框父类节点的最后一个当作是错误提示信息节点。当然也可以有其他的选择,如把错误信息节点的ID统一下。
参考文章
http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro5/
nodeName
报告节点的名称(详见下述)。
nodeValue
提供节点的 “值”(详见后述)。
-
parentNode
返回节点的父节点。记住,每个元素、属性和文本都有一个父节点。 -
childNodes
是节点的孩子节点列表。对于 HTML,该列表仅对元素有意义,文本节点和属性节点都没有孩子。 -
firstChild
仅仅是childNodes
列表中第一个节点的快捷方式。 -
lastChild
是另一种快捷方式,表示childNodes
列表中的最后一个节点。 -
previousSibling
返回当前节点之前 的节点。换句话说,它返回当前节点的父节点的childNodes
列表中位于该节点前面的那个节点(如果感到迷惑,重新读前面一句)。 -
nextSibling
类似于previousSibling
属性,返回父节点的childNodes
列表中的下一个节点。 -
attributes
仅用于元素节点,返回元素的属性列表。
-
insertBefore(newChild, referenceNode)
将newChild
节点插入到referenceNode
之前。记住,应该对newChild
的目标父节点调用该方法。 -
replaceChild(newChild, oldChild)
用newChild
节点替换oldChild
节点。 -
removeChild(oldChild)
从运行该方法的节点中删除oldChild
节点。 -
appendChild(newChild)
将newChild
添加到运行该函数的节点之中。newChild
被添加到目标节点孩子列表中的末端。 -
hasChildNodes()
在调用该方法的节点有孩子时则返回 true,否则返回 false。 -
hasAttributes()
在调用该方法的节点有属性时则返回 true,否则返回 false。