jQuery中.html()用为读取和修改元素的HTML标签,.text()用来读取或修改元素的纯文本内容,.val()用来读取或修改表单元素的value值。

1.HTML

html():取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档

html(val):设置每一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。

2.TEXT

text():取得所有匹配元素的内容。

结果是由所有匹配元素包含的文本内容组合起来的文本。这个方法对HTML和XML文档都有效。

text(val):设置所有匹配元素的文本内容

与 html() 类似, 但将编码 HTML (将 "<" 和 ">" 替换成相应的HTML实体).

3.VAL

val():获得第一个匹配元素的当前值。

val(val):设置每一个匹配元素的值。

上面的内容是在JQuery的帮助文档里拷贝的。

最后总结一下这三个方法:

  1. .html()用为读取和修改元素的HTML标签
  2. .text()用来读取或修改元素的纯文本内容
  3. .val()用来读取或修改表单元素的value值。

这三个方法功能上的对比:

  1. .html(),.text(),.val()三种方法都是用来读取选定元素的内容;
  2. 只不过.html()是用来读取元素的HTML内容(包括其Html标签),.text()用来读取元素的纯文本内容,包括其后代元素,.val()是用来读取表单元素的"value"值。
  3. 其中.和.text()方法不能使用在表单元素上,而.val()只能使用在表单元素上;
  4. 另外.html()方法使用在多个元素上时,只读取第一个元素;
  5. .val()方法和.html()相同,如果其应用在多个元素上时,只能读取第一个表单元素的"value"值,但是.text()和他们不一样,如果.text()应用在多个元素上时,将会读取所有选中元素的文本内容。
  6. .html(htmlString),.text(textString)和.val(value)三种方法都是用来替换选中元素的内容,如果三个方法同时运用在多个元素上时,那么将会替换所有选中元素的内容。
  7. .html(),.text(),.val()都可以使用回调函数的返回值来动态的改变多个元素的内容。

<参考: 『jQuery』.html(),.text()和.val()的概述及使用 & 浅析JQuery中的html(),text(),val()区别>

JQuery中的html(),text(),val()区别的更多相关文章

  1. 浅析JQuery中的html(),text(),val()区别

    1.HTML html():取得第一个匹配元素的html内容.这个函数不能用于XML文档.但可以用于XHTML文档 html(val):设置每一个匹配元素的html内容.这个函数不能用于XML文档.但 ...

  2. JQuery中attr ,html,text,val,的一些用法

    attr:主要获取元素内部的属性,返回 的是属性值 html:返回当前元素(不包括他自己本身的标签,但是可以返回他自己的)的标签加上内容.仅限于返回第一个. text:和 .html() 方法不同, ...

  3. [转载]jQuery中的html,val,text区别

    在jquery中 text() 返回目标元素所包含的所有文本内容,注意不包含html标签 alert($("#shuru").text()); 1 html() 返回目标元素所包含 ...

  4. jquery 中 html与text函数的区别

    jquery 中 html与text函数的区别 共同点:它们都能讲函数中的参数渲染到页面中: 异同点: text() 只是简单的讲参数的内容写入到页面中: html() 会根据参数的值,判断是否字体符 ...

  5. 【jQuery】【转】jQuery中的trigger和triggerHandler区别

    trigger(event, [data]) 在每一个匹配的元素上触发某类事件. 这个函数也会导致浏览器同名的默认行为的执行.比如,如果用trigger()触发一个'submit',则同样会导致浏览器 ...

  6. jquery中this与$this的区别

    来源:http://www.jb51.net/article/19738.htm jQuery中this与$(this)的区别 $("#textbox").hover( funct ...

  7. Jquery中.attr()和.data()的区别

    $.attr()和$.data()本质上属于DOM属性和Jquery对象属性的区别. 一个简单的例子 <!DOCTYPE html> <html> <head> & ...

  8. jQuery中first-child与first选择器区别

    1.first-child first-child为每个父级元素匹配第一个子元素,可以匹配出多个元素: 示例代码: <!DOCTYPE html> <html lang=" ...

  9. jquery中prop和attr的区别

    jquery中prop和attr的区别 prop: prop(name|properties|key,value|fn) **概述** 获取在匹配的元素集中的第一个元素的属性值. 随着一些内置属性的D ...

随机推荐

  1. 微信公众平台教程和SDK收集

    教程收集: 1.Senparc(.net) http://www.cnblogs.com/szw/archive/2013/05/14/weixin-course-index.html 2.方倍工作室 ...

  2. Python简介及环境部署

    Python的由来:         Python的创始人:Guido van Rossum Guido 在1989年12月时,寻找一门“课余”编程项目来打发圣诞节前后的时间.Guido决定为当时正构 ...

  3. ANDROID版本号和版本名称的重要性介绍

    当我们在刚开始学习ANDROID的时候,可能不会过多的关注这个位于manifest.xml文件中的versionCode和versionName. 但是其实一个好的版本控制,对于我们有至关重要的作用. ...

  4. HDU 4857 逃生(反向拓扑排序)

    传送门 Description 糟糕的事情发生啦,现在大家都忙着逃命.但是逃命的通道很窄,大家只能排成一行. 现在有n个人,从1标号到n.同时有一些奇怪的约束条件,每个都形如:a必须在b之前.同时,社 ...

  5. log4net配置和获取ILog实例

    名称 描述 File 文件路径,如果RollingStyle为Composite或Date,则这里设置为目录,文件名在DatePattern里设置,其他则这里要有文件名.已经扩展支持虚拟目录 Roll ...

  6. Beta版本——第一次冲刺博客

    我说的都队 031402304 陈燊 031402342 许玲玲 031402337 胡心颖 03140241 王婷婷 031402203 陈齐民 031402209 黄伟炜 031402233 郑扬 ...

  7. jQuery知识点总结(第二天)

    今天继续从我的笔记上面搬运.我们不产生知识,只是知识的搬运工. 内容过滤选择器: ○ 内容选择过滤器                                       $("div ...

  8. 修改nginx的访问目录以及遇到的403错误修改总结

    对于这个问题困扰了我好几天,前篇文章介绍了图片服务器的使用,但是两个服务器如何进行通话访问呢,即如何通过nginx来访问ftp服务器上的资源文件呢,这里面需要修改nginx的配置文件(vi /usr/ ...

  9. JS定时器

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. Linux查看CPU和内存使用情况

    在系统维护的过程中,随时可能有需要查看 CPU 使用率,并根据相应信息分析系统状况的需要.在 CentOS 中,可以通过 top 命令来查看 CPU 使用状况.运行 top 命令后,CPU 使用状态会 ...