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>