jQuery 的Dom 操作，validate插件完成自定义表单验证，以及jquery 完成省市联动

最新推荐文章于 2022-01-11 11:20:46 发布

打豆豆。

最新推荐文章于 2022-01-11 11:20:46 发布

阅读量529

点赞数

分类专栏： JS和JQuery 文章标签： dom节点 validate插件

本文链接：https://blog.csdn.net/weixin_42323802/article/details/82846972

版权

jQuery对DOM节点操作：

添加；

删除；

替换；

遍历；

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../../../../config/jquery-3.3.1.min.js"></script>
    <!--添加节点append(context)   和  appendTo(selector )-->
    <script type="text/javascript">
        $(function () {
            $(".but").click(function () {   //使用的class绑定事件，给ol列表中添加li
                $("ol").append("<li>打豆豆</li>");
            });
        });
    </script>
    <!--删除节点  remove  和empty()-->
    <script type="text/javascript">
        $(function () {
            $("#but2").click(function () {//给按钮绑定事件，删除li内容；
                $("ol").remove();
            });
            $("#but3").click(function () { //清空li,ol标签还在；
                $("ol").empty();
            });
        });
    </script>
    <!--替换节点  $().replaceWith(context)-->
    <script type="text/javascript">
        $(function () {
            $("#but4").dblclick(function () { //给but4 绑定双击事件，替换id=li1的内容；
                $("#li1").replaceWith("<li id=\"li1\">就知道吃</li>");
            });
        });
    </script>
    <!--遍历ol 集合jq 的全局方式:  $.each( jq对象 ,函数 );
    或者 jq 的一般方式-->
    <script type="text/javascript"&