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 捕获的更多相关文章

  1. JQuery:JQuery捕获HTML

    JQuery:捕获HTML1.jQuery - 获取内容和属性介绍: jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuer ...

  2. jQuery捕获

    获得内容 - text().html() 以及 val() 三个简单实用的用于 DOM 操作的 jQuery 方法: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元 ...

  3. jQuery捕获-获取DOM元素内容和属性

    一.获取内容 1.text()-设置或返回所选元素的文本内容 2.html()-设置或返回所选元素的内容(包括HTML标记) 3.val()-设置或 返回表单字段的值 $(document).read ...

  4. 使用JS或jQuery模拟鼠标点击a标签事件

    <a id="alink" href="abc.aspx"  style="visibility: hidden;">下一步&l ...

  5. 使用JS或jQuery模拟鼠标点击a标签事件代码

    原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...

  6. JQuery 方法合集(懒人备记)

    原创文章,转载请私信.谢谢~ PS:请将jquery的引用文件放在head的标签内 语法:$(selector).action() $(document).ready(function(){ // 开 ...

  7. jquery模拟点击A标签的问题

    我尝试过多次用jQuery模拟用户点击a标签的功能,但都没有成功,并且困扰了很久. 先看下边的代码: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 <htm ...

  8. jquery基础研究学习【HTML】

    jQuery HTMLjQuery 捕获jQuery 设置jQuery 添加元素jQuery 删除元素jQuery CSS 类jQuery css() 方法jQuery 尺寸 笔记:

  9. javaScript 笔记(6) --- jQuery(下)

    目录 --- jQuery HTML --- jQuery 遍历 --- jQuery Ajax jQuery HTML: jQuery 捕获:三个简单实用的用于 DOM 操作的 jQuery 方法: ...

随机推荐

  1. python/socket编程之粘包

    python/socket编程之粘包 粘包 只有TCP有粘包现象,UDP永远不会粘包. 首先需要掌握一个socket收发消息的原理 发送端可以是1k,1k的发送数据而接受端的应用程序可以2k,2k的提 ...

  2. Struts(十):OGNL表达式(一)

    Struts2 用s:porperty标签和OGNL表达式来读取值栈中的属性值: I.值栈中的属性值: 1.对象栈:读取对象栈中的某一个对象的属性值: 2.Map栈 :request,session, ...

  3. spring boot 系列之三:spring boot 整合JdbcTemplate

    前面两篇文章我们讲了两件事情: 通过一个简单实例进行spring boot 入门 修改spring boot 默认的服务端口号和默认context path 这篇文章我们来看下怎么通过JdbcTemp ...

  4. 使用一个Python脚本来运行一个简单的Django项目

    创建视图 Django是一个模型-模板-视图(model-template-view,MTV)框架. 视图部分通常检查看HTTP给出的请求和查询或者结构,这些信息是发送到表示层的数据. 我们在 hel ...

  5. mysql用limit时offset越大时间越长

    首先说明一下MySQL的版本:mysql> select version();+-----------+| version() |+-----------+| 5.7.17    |+----- ...

  6. [LeetCode] Max Stack 最大栈

    Design a max stack that supports push, pop, top, peekMax and popMax. push(x) -- Push element x onto ...

  7. 【Uva 11280 飞到弗雷德里顿】

    ·你可以尽情地坐飞机,但停留次数遭到限制. ·英文题,述大意:       给出一张有向图,起点是输入的第一个城市,终点是输入的最后一个城市.给出q个询问,每个询问含一个t,表示 #include&l ...

  8. hdu 5643 BestCoder Round #75

    King's Game  Accepts: 249  Submissions: 671  Time Limit: 2000/1000 MS (Java/Others)  Memory Limit: 6 ...

  9. quartz问题记录-missed their scheduled fire-time

    这里有3个原因:1.所有的woker thread(工作线程; 辅助线程)都在运行其他的job2.scheduler(调度器)down了(关于这个down.我不太明确是shutdown了..还是挂掉了 ...

  10. 我用 tensorflow 实现的“一个神经聊天模型”:一个基于深度学习的聊天机器人

    概述 这个工作尝试重现这个论文的结果 A Neural Conversational Model (aka the Google chatbot). 它使用了循环神经网络(seq2seq 模型)来进行 ...