锋利的jQuery读书笔记(2)

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script type="text/javascript" src="https://www.linuxidc.com/js/jquery-2.1.3.js"></script>
    <style>
        * { margin:0; padding:0;}
        body { font-size:12px;}
        .comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;}
        .comment h6 { font-weight:700; font-size:14px;}
        .para { margin-top:5px; text-indent:2em;background:#DDD;}
    </style>
    <title></title>
</head>
<body>

<input type="button" value="Ajax获取" />
<div>已有评论</div>
<div></div>

</body>

<script type="text/javascript">
    $(function () {
        $("#send").click(function () {
            $("#resText").load("test.html .para");
        });
    })

/**
    * 筛选载入的HTML文档
    *
    * load()方法的URL参数的语法结构为:"url selector",注意URL和选择器之间有一个空格
    *
    * load()方法的传递方式根据参数data来自动指定。
    *      如果没有参数传递,则采用GET方式进行传递;
    *      反之,则会自动转换为POST传递
    *
    * **/

</script>

</html>

load()方法---回调函数

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script type="text/javascript" src="https://www.linuxidc.com/js/jquery-2.1.3.js"></script>
    <style>
        * { margin:0; padding:0;}
        body { font-size:12px;}
        .comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;}
        .comment h6 { font-weight:700; font-size:14px;}
        .para { margin-top:5px; text-indent:2em;background:#DDD;}
    </style>
    <title></title>
</head>
<body>

<input type="button" value="Ajax获取" />
<div>已有评论</div>
<div></div>

</body>

<script type="text/javascript">
    $(function () {
        $("#send").click(function () {
            $("#resText").load("test.html .para", function (responseText, textStatus, XMLHttpRequest) {
                alert($(this).html());
                alert(responseText);//请求返回的内容
                alert(textStatus);//请求状态:success、error、notmodified、timeout
                alert(XMLHttpRequest);//XMLHttpRequest对象
            });
        });
    })

/**
    *
    * load()方法的回调参数
    *
    * **/

</script>

</html>

jQuery权威指南 PDF版中文+配套源代码

jQuery实战 中文PDF+源码

《jQuery即学即用(双色)》 PDF+源代码

锋利的jQuery(第2版) 完整版PDF+源码

jQuery完成带复选框的表格行高亮显示

jQuery基础教程(第4版) PDF 完整高清版+配套源码

--------------------------------------分割线 --------------------------------------

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/2eade6fb728eec4411f0dfd3ba5398e0.html