jQuery-AJAX

最新推荐文章于 2023-10-20 23:35:27 发布

小田同學

最新推荐文章于 2023-10-20 23:35:27 发布

阅读量432

点赞数

分类专栏： jQuery 文章标签： jquery ajax load post get

本文链接：https://blog.csdn.net/Sabrina_TSM/article/details/51384370

版权

jQuery 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

通过 jQuery AJAX 方法，能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时能够把这些外部数据直接载入网页的被选元素中。
（1） load()方法
load() 方法从服务器加载数据，并把返回的数据放入被选元素中。

$(selector).load(URL,data,callback);

必需的 URL 参数规定您希望加载的 URL。
可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
可选的 callback 参数是 load() 方法完成后所执行的函数名称。

（2） ajax()方法
ajax() 方法通过 HTTP 请求加载远程数据。

（3） get()方法
get()方法通过 HTTP GET 请求从服务器上请求数据。

$.get(URL,callback);

必需的 URL 参数规定您希望请求的 URL。
可选的 callback 参数是请求成功后所执行的函数名。

（4）POST()方法
post() 方法通过 HTTP POST 请求从服务器上请求数据。
$.post(URL,data,callback);
必需的 URL 参数规定您希望请求的 URL。
可选的 data 参数规定连同请求发送的数据。
可选的 callback 参数是请求成功后所执行的函数名。

具体代码如下：

    <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
    <style type="text/css">
        #divframe{border: 1px solid #999999;width: 500px;margin: 0 auto;}
        .loadTitle{background: #cccccc;height: 30px;}
    </style>
    <script>
        $(function(){
            //1.使用load方法
//            $("#btn").click(function(){
//                //加载整个页面
//                //$("#ajaxTip").load("aa.html");
//                //加载页面中的某一个元素
//                $("#ajaxTip").load("aa.html #userinfo");
//            });
            //2.使用AJAX
//            $("#btn").click(function(){
//                htmlobj = $.ajax({url:"aa.html #userinfo",async:false});
//                $("#ajaxTip").html(htmlobj.responseText);
//            });
            //3.get方法
//            $("#btn").click(function(){
//                htmlobj = $.get("hello.txt",function(){
//                    $("#ajaxTip").html(htmlobj.responseText);
//                });
//            });
            //4.post方法
            $("#btn").click(function(){
                $.post("hello.txt",
                function(data){
                    $("#ajaxTip").html("获取的数据为:<br/>"+data);
                });
            });
        });
    </script>

</head>
<body>
<div id="divframe">
    <div class="loadTitle">
        <input type="button" value="获取数据" id="btn"/>
    </div>
    <div id="ajaxTip">
    </div>
</div>

小田同學

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery-AJAX

通过 jQuery AJAX 方法，能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时能够把这些外部数据直接载入网页的被选元素中。（1） load()方法 load() 方法从服务器加载数据，并把返回的数据放入被选元素中。$(selector).load(URL,data,callback);必需的 URL 参数规定您希望加载
复制链接

扫一扫