zoukankan      html  css  js  c++  java
  • 过滤HTML控件,将输入控件替换成SPAN


    /*
    功能:过滤HTML控件,将输入控件替换成SPAN
    Author: jop
    DateTime: 2008-12-29
    参数说明:elements 要删除的控件数组;
    */
    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];
    }

    //删除表单原控件
    for(var i=0;i<arrObj.length;i++)
    {
    arrObj[i].removeNode();
    }
    }

    /*
    调用事例
    */
    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('烟花三月下杨州');
    pNode.appendChild(tNode);
    document.body.appendChild(pNode);
    }
    function r() {
    var pNode = document.createElement('p');
    var tNode = document.createTextNode('故人西辞黄鹤楼');
    pNode.appendChild(tNode);
    //获取要替换的节点
    var reNode = document.getElementsByTagName('p')[0];
    //这种方法只适用于IE浏览器
    //reNode.replaceNode(pNode, reNode);
    //适用于各种浏览器
    reNode.parentNode.replaceChild(pNode, reNode);
    }
    function reNode() {
    var oldNode = document.getElementsByTagName('p')[0];
    //oldNode.parentNode返回的是p节点的父节点,这里就是body
    //然后使用body节点的removeChild方法删除下的oldNode节点
    oldNode.parentNode.removeChild(oldNode);
    }
    </script>
    </head>
    <body>
    <input id="Button1" type="button" value="创建节点" onclick="createNode()"/>
    <input id="Button2" type="button" value="替换节点" onclick="r()" />
    <input id="Button3" type="button" value="删除节点" onclick="reNode()" />
    </body>
    </html>

  • 相关阅读:
    java10 var
    java lambda,方法引用
    Java集合总结
    Oracle/Sun JDK与OpenJDK的区别和联系
    IO基本知识
    字符串反转2单词内部不进行转换
    反转String 1
    java 左移<<&>>右移&>>无符号右移
    反射
    equals方法与hashcode方法
  • 原文地址:https://www.cnblogs.com/pingping/p/4053415.html
Copyright © 2011-2022 走看看