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简单绑定单个事件的方法示例
Jun 10 jQuery
基于jQuery实现手风琴菜单、层级菜单、置顶菜单、无缝滚动效果
Jul 20 jQuery
基于jQuery实现图片推拉门动画效果的两种方法
Aug 26 jQuery
HTML5+JS+JQuery+ECharts实现异步加载问题
Dec 16 jQuery
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】
Mar 28 jQuery
jQuery实现基本隐藏与显示效果的方法详解
Sep 05 jQuery
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 jQuery
JS实现点击生成UUID的方法完整实例【基于jQuery】
Jun 12 jQuery
jQuery实现移动端下拉展现新的内容回弹动画
Jun 24 jQuery
jQuery实现简单QQ聊天框
Aug 27 jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 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
用PHP伪造referer突破网盘禁止外连的代码
2008/06/15 PHP
PHPMyadmin 配置文件详解(配置)
2009/12/03 PHP
PHP的substr_replace将指定两位置之间的字符替换为*号
2011/05/04 PHP
PHP获取数组中某元素的位置及array_keys函数应用
2013/01/29 PHP
phpmyadmin配置文件现在需要绝密的短密码(blowfish_secret)的2种解决方法
2014/05/07 PHP
利用PHP绘图函数实现简单验证码功能的方法
2016/10/18 PHP
关于ThinkPhp 框架表单验证及ajax验证问题
2017/07/19 PHP
tp5(thinkPHP5)框架实现多数据库查询的方法
2019/01/10 PHP
laravel validate 设置为中文的例子(验证提示为中文)
2019/09/29 PHP
用JavaScript实现仿Windows关机效果
2007/03/10 Javascript
JavaScript的eval JSON object问题
2009/11/15 Javascript
小议Javascript中的this指针
2010/03/18 Javascript
javascript实现依次输入input自动定焦
2014/12/23 Javascript
解决jquery插件:TypeError:$.browser is undefined报错的方法
2015/11/21 Javascript
JS实现的适合做faq或menu滑动效果示例
2016/11/17 Javascript
详谈表单格式化插件jquery.serializeJSON
2017/06/23 jQuery
JavaScript实现简单图片轮播效果
2017/08/21 Javascript
使用puppeteer破解极验的滑动验证码
2018/02/24 Javascript
vue 判断两个时间插件结束时间必选大于开始时间的代码
2020/11/04 Javascript
使用python在校内发人人网状态(人人网看状态)
2014/02/19 Python
python 实现网上商城,转账,存取款等功能的信用卡系统
2016/07/15 Python
python解决Fedora解压zip时中文乱码的方法
2016/09/18 Python
Python3 处理JSON的实例详解
2017/10/29 Python
python K近邻算法的kd树实现
2018/09/06 Python
pandas实现to_sql将DataFrame保存到数据库中
2019/07/03 Python
详解android与HTML混合开发总结
2018/06/06 HTML / CSS
Internet体系结构
2014/12/21 面试题
优秀导游先进事迹材料
2014/01/25 职场文书
校园活动宣传方案
2014/03/28 职场文书
《大江保卫战》教学反思
2014/04/11 职场文书
2014年财务个人工作总结
2014/12/08 职场文书
2015选调生工作总结
2015/07/24 职场文书
校园安全学习心得体会
2016/01/18 职场文书
OpenCV-Python实现怀旧滤镜与连环画滤镜
2021/06/09 Python
基于Pygame实现简单的贪吃蛇游戏
2021/12/06 Python
Pandas-DataFrame知识点汇总
2022/03/16 Python