jQuery - 获取内容和属性

简介: jQuery - 获取内容和属性

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("值为: " + $("#test").val());});


尝试一下 »


获取属性 - attr()

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

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

实例

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


尝试一下 »

下一章会讲解如何设置(改变)内容和属性值。

目录
相关文章
|
1月前
|
XML JavaScript 数据格式
jQuery - 获取内容和属性
jQuery 拥有可操作 HTML 元素和属性的强大方法。
35 6
|
23天前
|
存储 JavaScript 前端开发
jQuery 对属性的操作
【10月更文挑战第8天】
|
6月前
|
缓存 JavaScript
|
2月前
|
JavaScript IDE 开发工具
jQuery - 获取内容和属性2
jQuery - 获取内容和属性2
19 3
|
2月前
|
JavaScript
jQuery - 设置内容和属性
jQuery - 设置内容和属性
58 2
|
2月前
|
JavaScript
jQuery - 设置内容和属性
jQuery - 设置内容和属性
53 14
|
2月前
|
XML JavaScript 数据格式
jQuery - 获取内容和属性
jQuery - 获取内容和属性
58 12
|
5月前
|
JavaScript 前端开发 安全
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
|
5月前
|
JavaScript 前端开发
js,jq,jquery删除css属性
js,jq,jquery删除css属性
36 0
|
6月前
|
JavaScript 前端开发
jquery的属性样式
jquery的属性样式
28 1