zoukankan      html  css  js  c++  java
  • DOM 动态创建结点

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>无标题页</title>
        <script type="text/javascript">
        <!--
            function makeNode(str)
            {
                var newParagraph = document.createElement('p');
                var newText = document.createTextNode(str);
                newParagraph.appendChild(newText);
                return newParagraph;
            }
            function appendBefore(nodeId,str)
            {
                var node = document.getElementById(nodeId);
                var newNode = makeNode(str);
                if(node.parentNode)
                    node.parentNode.insertBefore(newNode,node);
            }
            function inserWithin(nodeId,str)
            {
                var node = document.getElementById(nodeId);
                var newNode = makeNode(str);
                node.appendChild(newNode);
            }
            function appendAfter(nodeId,str)
            {
                var node = document.getElementById(nodeId);
                var newNode = makeNode(str);
                if(node.parentNode)
                {
                    if(node.nextSibling)
                        node.parentNode.insertBefore(newNode, node.nextSibling);
                    else
                        node.parentNode.appendChild(newNode);
                }
            }
               
        //-->
        </script>
    </head>
    <body>
    <h1>DOM 插入 与 增加</h1>
    <hr />
    <div style="background-color:#66ff00;">
        <div id="innerDiv" style ="background-color:#ffcc00;"></div>
    </div>
    <hr />
    <form id= "form1" name= "form1" action="#" method="get">
        <input type="text" id ="field1" name= "field1" />
        <input type="button" value="前插入" onclick="appendBefore('innerDiv',document.form1.field1.value);" />
        <input type="button" value="中插入" onclick="inserWithin('innerDiv',document.form1.field1.value);" />
        <input type="button" value="后插入" onclick="appendAfter('innerDiv',document.form1.field1.value);" />
    </form>
    </body>
    </html>

  • 相关阅读:
    一个优秀测试的自我修养
    二.自动化接口测试---用例设计思路、模版
    关于文件读写的一些笔记
    模块导入---如何在一个文件中导入其它模块,来调用它的变量、函数等,以节省代码量
    变量以及作用域----(局部变量、全部变量...)
    python连接mysql数据库
    python修改txt文件内容
    使用PyQt4写界面后台程序方法总结
    unresolved import 解决办法
    怎样使用pyinstaller打包
  • 原文地址:https://www.cnblogs.com/LinFx/p/2123732.html
Copyright © 2011-2022 走看看