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获取radio选中的值
May 05 jQuery
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
Jun 09 jQuery
简单谈谈require模块化jquery和angular的问题
Jun 23 jQuery
jQuery+vue.js实现的九宫格拼图游戏完整实例【附源码下载】
Sep 12 jQuery
jquery 一键复制到剪切板的实例
Sep 20 jQuery
jQuery 防止相同的事件快速重复触发方法
Feb 08 jQuery
jQuery实现通过方向键控制div块上下左右移动的方法【测试可用】
Apr 26 jQuery
Jquery和CSS实现选择框重置按钮功能
Nov 08 jQuery
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
Feb 14 jQuery
jQuery 筛选器简单操作示例
Oct 02 jQuery
jQuery+ajax实现用户登录验证
Sep 13 jQuery
jquery自定义组件实例详解
Dec 31 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
允许phpmyadmin空密码登录的配置方法
2011/05/29 PHP
在网页中控制wmplayer播放器
2006/07/01 Javascript
类似GMAIL的Ajax信息反馈显示
2010/02/16 Javascript
js下通过getList函数实现分页效果的代码
2010/09/17 Javascript
jquery datatable后台封装数据示例代码
2014/08/07 Javascript
jQuery Select下拉框操作小结(推荐)
2016/07/22 Javascript
canvas学习之API整理笔记(一)
2016/12/29 Javascript
ajax实现动态下拉框示例
2017/01/10 Javascript
vue实现样式之间的切换及vue动态样式的实现方法
2017/12/19 Javascript
React Component存在的几种形式详解
2018/11/06 Javascript
Vue触发式全局组件构建的方法
2018/11/28 Javascript
谈谈React中的Render Props模式
2018/12/06 Javascript
node错误处理与日志记录的实现
2018/12/24 Javascript
Mint UI实现A-Z字母排序的城市选择列表
2018/12/28 Javascript
JS 封装父页面子页面交互接口的实例代码
2019/06/25 Javascript
javascript中可能用得到的全部的排序算法
2020/03/05 Javascript
举例讲解Python中的Null模式与桥接模式编程
2016/02/02 Python
Python随机生成均匀分布在三角形内或者任意多边形内的点
2017/12/14 Python
python中正则表达式的使用方法
2018/02/25 Python
Python批量合并有合并单元格的Excel文件详解
2018/04/05 Python
python的concat等多种用法详解
2018/11/28 Python
djang常用查询SQL语句的使用代码
2019/02/15 Python
Python获取数据库数据并保存在excel表格中的方法
2019/06/12 Python
python3.6环境安装+pip环境配置教程图文详解
2019/06/20 Python
python自定义时钟类、定时任务类
2021/02/22 Python
python list转置和前后反转的例子
2019/08/26 Python
python字符串反转的四种方法详解
2019/12/02 Python
python实现音乐播放器 python实现花框音乐盒子
2020/02/25 Python
实习教师自我鉴定
2013/09/27 职场文书
优秀毕业大学生推荐信
2013/11/13 职场文书
物理力学求职信
2014/02/18 职场文书
家具商场的活动方案
2014/08/16 职场文书
党的群众路线教育实践活动党员个人剖析材料
2014/10/08 职场文书
学雷锋团日活动总结
2015/05/06 职场文书
大学生青年志愿者活动总结
2015/05/06 职场文书
Pytorch GPU内存占用很高,但是利用率很低如何解决
2021/06/01 Python