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绘制的2D双柱状图效果示例【附demo源码】
May 13 jQuery
使用 jQuery 实现表单验证功能
Jul 05 jQuery
vue单页应用中如何使用jquery的方法示例
Jul 27 jQuery
jQuery插件DataTables分页开发心得体会
Aug 22 jQuery
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
Sep 20 jQuery
解决Jquery下拉框数据动态获取的问题
Jan 25 jQuery
jQuery实现炫丽的3d旋转星空效果
Jul 04 jQuery
解决jQuery使用append添加的元素事件无效的问题
Aug 30 jQuery
jQuery实现的中英文切换功能示例
Jan 11 jQuery
基于jQuery实现可编辑的表格
Dec 11 jQuery
jquery检测上传文件大小示例
Apr 26 jQuery
jQuery实现查看图片功能
Dec 01 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守护进程类
2015/12/30 PHP
php验证身份证号码正确性的函数
2016/07/20 PHP
php基于curl实现的股票信息查询类实例
2016/11/11 PHP
PHP中phar包的使用教程
2017/06/14 PHP
在 Laravel 6 中缓存数据库查询结果的方法
2019/12/11 PHP
js资料toString 方法
2007/03/13 Javascript
一个简单的JavaScript 日期计算算法
2009/09/11 Javascript
使用jquery插件实现图片延迟加载技术详细说明
2011/03/12 Javascript
点击进行复制的JS代码实例
2013/08/23 Javascript
jquery+php实现搜索框自动提示
2014/11/28 Javascript
js实现鼠标感应向下滑动隐藏菜单的方法
2015/02/20 Javascript
js停止冒泡和阻止浏览器默认行为的简单方法
2016/05/15 Javascript
通过jquery-ui中的sortable来实现拖拽排序的简单实例
2016/05/24 Javascript
Bootstrap开关(switch)控件学习笔记分享
2016/05/30 Javascript
RequireJs的使用详解
2017/02/19 Javascript
vue-cli2.9.3 详细教程
2018/04/23 Javascript
浅谈关于vue中scss公用的解决方案
2019/12/02 Javascript
使用vue打包进行云服务器上传的问题
2020/03/02 Javascript
JQuery表单元素取值赋值方法总结
2020/05/12 jQuery
python如何将图片转换为字符图片
2020/08/19 Python
python检索特定内容的文本文件实例
2018/06/05 Python
一行代码让 Python 的运行速度提高100倍
2018/10/08 Python
python如何获取当前文件夹下所有文件名详解
2019/01/25 Python
使用pyinstaller打包PyQt4程序遇到的问题及解决方法
2019/06/24 Python
Python 仅获取响应头, 不获取实体的实例
2019/08/21 Python
基于selenium及python实现下拉选项定位select
2020/07/22 Python
python uuid生成唯一id或str的最简单案例
2021/01/13 Python
世界各地的旅游、观光和活动:Isango!
2019/10/29 全球购物
店面销售职位的职责
2014/03/09 职场文书
考试没考好检讨书(精选篇)
2014/11/16 职场文书
同学聚会邀请函
2015/01/30 职场文书
教师个人教学总结
2015/02/11 职场文书
人与自然观后感
2015/06/16 职场文书
2019行政前台转正申请书范文3篇
2019/08/15 职场文书
小学语文的各类谚语(70首)
2019/08/15 职场文书
Apache Linkis 中间件架构及快速安装步骤
2022/03/16 Servers