Jquery 捕获

1. 介绍¶

jQuery 拥有可操作 HTML 元素和属性的强大方法。Query 中非常重要的部分，就是操作 DOM[DOM = Document Object Model（文档对象模型）] 的能力。 jQuery 提供一系列与 DOM 相关的方法，这使访问和操作元素和属性变得很容易。

2. 获取值¶

我们常用三个简单实用的用于 DOM 操作的 jQuery 方法

text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容（包括 HTML 标记）
val() - 设置或返回表单字段的值
attr() - 获取属性值

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>caimengzhi blog jquery</title>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>

    <p id='ptext'>人生苦短，我用<b>Python</b></p>
    <button id="btn1">显示文本内容</button>
    <button id="btn2">显示HTML</button>
    <p>名称: <input type="text" id="test" value="hello cmz"></p>
    <button id="btn3">显示输入框里面值</button>
    <br>
    <a href="http://www.jd.com" id="jd">京东</a> <br>
    <button id="btn4">显示a标签属性</button>
</body>
<script>
    $(function (event) {
        $("#btn1").click(function(){
            console.log('文件内容是: '+$('p').text())
        });
        $("#btn2").click(function(){
            console.log('HTML网页: '+$('#ptext').html())
        });
        $('#btn3').click(function () {
            console.log('输入框里面的值是: '+$('#test').val())
        });
        $('#btn4').click(function () {
            console.log('a标签属性: '+$('#jd').attr("href"))
        })
    });
</script>
</html>