动态创建节点

最新推荐文章于 2021-09-24 18:50:32 发布

aibusi2584

最新推荐文章于 2021-09-24 18:50:32 发布

阅读量106

点赞数

文章标签： xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/LoVeSW/p/3425301.html

版权

<!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 src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("div:first").append("<a href='#'>百度</a>");
            var data = { "百度": "http://www.baidu.com", "新浪": "http://www.sina.com", "腾讯": "http://www.qq.com", "搜狐": "http://www.souhu.com" };
            $.each(data, function (key, value) {
                var tr = ("<tr><td>" + key + "</td><td><a href=" + value + ">" + key + "</a></td></tr>");
                $("#table1").append(tr); //append(tr)添加tr节点
            });
            $("#btn").click(function () {
                $("div").remove(); //remove()删除div节点
            });
            $("#clear").click(function () {
                $("div").empty(); //empty()清空div节点
            });

            $("#btn1").click(function () {
                var item = $("#select1 option:selected").remove();
                $("#select2").append(item);
            });
            $("#btn2").click(function () {
                var item = $("#select2 option:selected").remove();
                $("#select1").append(item);
            });
            $("#btn3").click(function () {
                var item = $("#select1 option").remove();
                $("#select2").append(item);
            });
            $("#btn4").click(function () {
                var item = $("#select2 option").remove();
                $("#select1").append(item);
            });
        });
       
    </script>
</head>
<body>
<div>
dsfsdf
</div>
<table id="table1">
</table>
<input type="button" id="btn" value="删除div" />
<input type="button" id="clear" value="清空div" />
<select style="height:100px;float:left;width:15%;" id="select1" multiple="multiple">
<option>添加</option>
<option>删除</option>
<option>修改</option>
<option>查询</option>
<option>打印</option>
</select>
<div style="float:left;">
<input type="button" id="btn1" value=">" /><br />
<input type="button" id="btn2" value="<" /><br />
<input type="button" id="btn3" value=">>" /><br />
<input type="button" id="btn4" value="<<" /><br />
</div>
<select style="height:100px;float:left;width:15%;" id="select2" multiple="multiple">
</select>
</body>
</html>

转载于:https://www.cnblogs.com/LoVeSW/p/3425301.html

aibusi2584

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
动态创建节点

<!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&gt...
复制链接

扫一扫