jquery添加和删除元素

最新推荐文章于 2023-04-17 19:11:51 发布

孤独的酒

最新推荐文章于 2023-04-17 19:11:51 发布

阅读量321

点赞数

分类专栏： jquery 文章标签： jquery append remove

jquery 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>测试添加和删除元素</title>
<script type="text/javascript" language="javascript" src="../jquery/jquery.js"></script>
<style type="text/css">
    ul li{
        list-style-type:none;   
    }
</style>
</head>
<body>
    <input type="button" value="添加元素" οnclick="add_element();">
    <ul id="add">
        <li><input type="text" class="list" style="width:200px;"></li>
    </ul>
    <input type="button" value="添加" οnclick="add();">
</body>
<script type="text/javascript">
    function add_element(){
        var str='<li><input type="text" class="list" style="width:200px;"><input type="button" value="删除" οnclick="del(this)"></li>'
        $("#add").append(str); //向ul里面添加元素
    }
 
    function del(element){ 
        $(element).parent().remove(); //获取input所在的父节点(外包的li元素)
    }
 
    function add(){  //获取运输的值
        var elementlist=$(".list");
        for(var i=0;i<elementlist.length;i++){
            alert(elementlist[i].value);
        }
    }
     
</script>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

孤独的酒

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery添加和删除元素

测试添加和删除元素 ul li{ list-style-type:none; } function add_element(){ var str='' $("#add").append(str); //向ul里面添加元素 } fu
复制链接

扫一扫