jquery + ajax 局部刷新

最新推荐文章于 2020-07-13 17:46:08 发布

rudy24

最新推荐文章于 2020-07-13 17:46:08 发布

阅读量405

点赞数

分类专栏： ajax 文章标签： jquery ajax 局部刷新

本文链接：https://blog.csdn.net/rudy24/article/details/51161298

版权

ajax 专栏收录该内容

1 篇文章 0 订阅

订阅专栏


//这是html清单
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <div class="info">
            <p>这是我的名字</p>
            <p>这是我的年纪</p>
        </div>
        <button class="btn">获取我的信息</button>
        <script type="text/javascript" src="js/jquery-1.7.min.js"></script>
        <script type="text/javascript">
            $(function(){
                $(".btn").click(function(){
                    var innerHTML = "";
                    $.ajax({
                    type:"get",
                    url:"data2.json",
                    dataType:"json",
                    async:true,
                    success:function(data){
                            $.each(data, function(index,element) {
                                    innerHTML = "<p>" + data[index].name + "</p>" + "<p>" + data[index].age + "</p>"
                            })
                            $(".info").html(innerHTML);
                    },
                    error:function(){
                        console.log("出现错误了");
                    }
                    })
                })
            })
        </script>
    </body>
</html>

//json

[
    {"name":"i'm rudy","age":"28"}
]

rudy24

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery + ajax 局部刷新

//这是html清单<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div class="info"> <p>这是我的名字</p> <p>这是我的年纪</p>
复制链接

扫一扫