/*
Function: Filter the HTML control to replace the input control with a span
Author:jop
datetime:2008-12-29
Parameter description: Elements the array of controls to delete;
*/
function Removecontrol (elements)
{
var arrobj = new Array ();
var count = elements.length;
for (Var i=0;i<count;i++)
{
if (elements[i] = = undefined)
Continue
var obj = document.createelement (' span ');
Switch (elements[i].type)
{
Case "Text":
Obj.setattribute ("InnerHTML", Elements[i].value);
Break
Case "TEXTAREA":
Obj.setattribute ("InnerHTML", elements[i].innerhtml);
elements[i].innerhtml = ";
Break
Case "SELECT":
for (Var j=0;j<elements[i].length;j++)
{
if (elements[i][j].selected)
{
Obj.setattribute ("InnerHTML", Elements[i][j].text);
Break
}
}
elements[i].options.length = 0;
Break
}
Elements[i].parentnode.appendchild (obj);
Arrobj[arrobj.length] = elements[i];
}
Delete Form Original control
for (Var i=0;i<arrobj.length;i++)
{
Arrobj[i].removenode ();
}
}
/*
Invoke case
*/
function Filter ()
{
document.getElementById (' tab_forms '). InnerHTML = document.getElementById (' tab_forms '). Innerhtml.replace (/'/g, ‘‘);//
/* Input Filter */
var elements = document.getElementById (' tab_forms '). getElementsByTagName (' input ');
Removecontrol (elements);
/* TextArea Filter */
elements = document.getElementById (' tab_forms '). getElementsByTagName (' textarea ');
Removecontrol (elements);
/* SELECT */
elements = document.getElementById (' tab_forms '). getElementsByTagName (' select ');
Removecontrol (elements);
Alert (document.getElementById (' tab_forms '). InnerHTML); Onload= "Filter ();"
}
-----------------------------------------------2-------------------------------------
<title></title>
<script type= "Text/javascript" >
function CreateNode () {
var pnode = document.createelement (' P ');
var tnode = document.createTextNode (' Fireworks under Yang State ');
Pnode.appendchild (tnode);
Document.body.appendChild (Pnode);
}
function R () {
var pnode = document.createelement (' P ');
var tnode = document.createTextNode (' west of the deceased, Yellow Crane Tower ');
Pnode.appendchild (tnode);
Get the node to replace
var renode = document.getelementsbytagname (' P ') [0];
This method is only applicable to IE browser
Renode.replacenode (Pnode, Renode);
Available in a variety of browsers
ReNode.parentNode.replaceChild (Pnode, Renode);
}
function Renode () {
var oldNode = document.getelementsbytagname (' P ') [0];
Oldnode.parentnode returns the parent node of the P node, which is the body
Then use the RemoveChild method of the body node to delete the next OldNode node
OldNode.parentNode.removeChild (OldNode);
}
</script>
<body>
<input id= "Button1" type= "button" value= "Create Node" onclick= "CreateNode ()"/>
<input id= "Button2" type= "button" value= "Replace node" onclick= "R ()"/>
<input id= "Button3" type= "button" value= "Delete node" onclick= "Renode ()"/>
</body>
Filter the HTML control to replace the input control with a span