JQuery获得内容和属性方法解析


Posted in jQuery onMay 30, 2020

jQuery 拥有可操作 HTML 元素和属性的强大方法。

jQuery DOM 操作

jQuery 中非常重要的部分,就是操作 DOM 的能力。

jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易。

提示:DOM = Document Object Model(文档对象模型)

DOM 定义访问 HTML 和 XML 文档的标准:

“W3C 文档对象模型独立于平台和语言的界面,允许程序和脚本动态访问和更新文档的内容、结构以及样式。”

获得内容 - text()、html() 以及 val()

三个简单实用的用于 DOM 操作的 jQuery 方法:

  • text() - 设置或返回所选元素的文本内容
  • html() - 设置或返回所选元素的内容(包括 HTML 标记)
  • val() - 设置或返回表单字段的值

下面的例子演示如何通过 jQuery text() 和 html() 方法来获得内容:

实例

$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});

下面的例子演示如何通过 jQuery val() 方法获得输入字段的值:

实例

$("#btn1").click(function(){
alert("Value: " + $("#test").val());
});

获取属性 - attr()

jQuery attr() 方法用于获取属性值。

下面的例子演示如何获得链接中 href 属性的值:

实例

$("button").click(function(){
alert($("#w3s").attr("href"));
});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 jQuery
jQuery插件之validation插件
Mar 29 jQuery
jquery dataTable 后台加载数据并分页实例代码
Jun 07 jQuery
jQuery Validate格式验证功能实例代码(包括重名验证)
Jul 18 jQuery
jQuery实现拼图小游戏(实例讲解)
Jul 24 jQuery
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
Aug 01 jQuery
详解jquery选择器的原理
Aug 01 jQuery
jQuery实现右侧抽屉式在线客服功能
Dec 25 jQuery
jQuery使用bind动态绑定事件无效的处理方法
Dec 11 jQuery
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
Sep 10 jQuery
JQuery实现折叠式菜单的详细代码
Jun 03 jQuery
详解jQuery的核心函数和事件处理
Feb 18 jQuery
jQuery实现视频展示效果
May 30 #jQuery
基于JavaScript或jQuery实现网站夜间/高亮模式
May 30 #jQuery
Jquery+AJAX实现无刷新上传并重命名文件操作示例【PHP后台接收】
May 29 #jQuery
jQuery+css实现的点击图片放大缩小预览功能示例【图片预览 查看大图】
May 29 #jQuery
Jquery高级应用Deferred对象原理及使用实例
May 28 #jQuery
JQuery插件tablesorter表格排序实现过程解析
May 28 #jQuery
jQuery实现鼠标滑动切换图片
May 27 #jQuery
You might like
Cannot modify header information错误解决方法
2008/10/08 PHP
PHP5.2中date()函数显示时间与北京时间相差8小时的解决办法
2009/05/28 PHP
php实现过滤字符串中的中文和数字实例
2015/07/29 PHP
PHP中抽象类、接口的区别与选择分析
2016/03/29 PHP
PHP使用Session实现上传进度功能详解
2019/08/06 PHP
myFocus slide3D v1.1.0 使用方法与下载
2011/01/12 Javascript
用js小类库获取浏览器的高度和宽度信息
2012/01/15 Javascript
jquery实现漂浮在网页右侧的qq在线客服插件示例
2013/05/13 Javascript
Javascript之this关键字深入解析
2013/11/12 Javascript
js使用ajax读博客rss示例
2014/05/06 Javascript
JQuery实现防止退格键返回的方法
2015/02/12 Javascript
js检测iframe是否加载完成的方法
2015/11/26 Javascript
javascript事件处理模型实例说明
2016/05/31 Javascript
SeaJS中use函数用法实例分析
2017/10/10 Javascript
vue 组件 全局注册和局部注册的实现
2018/02/28 Javascript
详解Vue文档中几个易忽视部分的剖析
2018/03/24 Javascript
原生js实现3D轮播图
2020/03/21 Javascript
微信小程序列表时间戳转换实现过程解析
2019/10/12 Javascript
微信小程序缓存支持二次开发封装实现解析
2019/12/16 Javascript
javascript读取本地文件和目录方法详解
2020/08/06 Javascript
github配置使用指南
2014/11/18 Python
在Python中操作字典之fromkeys()方法的使用
2015/05/21 Python
Python 类与元类的深度挖掘 II【经验】
2016/05/06 Python
Python中关键字nonlocal和global的声明与解析
2017/03/12 Python
Python自动化运维之IP地址处理模块详解
2017/12/10 Python
解决python "No module named pip" 的问题
2018/10/13 Python
Django-imagekit的使用详解
2020/07/06 Python
Python如何设置指定窗口为前台活动窗口
2020/08/12 Python
Python爬取股票信息,并可视化数据的示例
2020/09/26 Python
Python之Sklearn使用入门教程
2021/02/19 Python
如何给HTML标签中的文本设置修饰线
2019/11/18 HTML / CSS
什么是触发器(trigger)? 触发器有什么作用?
2013/09/18 面试题
WINDOWS域的具体实现方式是什么
2014/02/20 面试题
学校办公室主任岗位职责
2015/04/01 职场文书
环保宣传语大全
2015/07/13 职场文书
在windows server 2012 r2中安装mysql的详细步骤
2022/07/23 Servers