专栏首页lgp20151222jquery的html,text,val

jquery的html,text,val

意义:

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

这三个方法功能上的对比 .html(),.text(),.val()三种方法都是用来读取选定元素的内容;

只不过.html()是用来读取元素的HTML内容(包括其Html标签),.text()用来读取元素的纯文本内容,包括其后代元素,.val()是用来读取表单元素的"value"值。

其中.和.text()方法不能使用在表单元素上,而.val()只能使用在表单元素上;

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

<div id="div">
    <p>here is a paragram</p>
    <div>here is a big DIV</div>
</div>

function showVal(){
   var div = $("#div");
    alert("showVal():  "+div.val());
//显示为空
}
function showHtml(){
   var div = $("#div");
   alert("showHtml():  "+div.html());
//显示为:
//<p>here is a paragram</p>
//<div>here is a big DIV</div>
}
function showText(){
    var div = $("#div");
    alert("showText():  "+div.text());
//显示为:
//here is a paragram
//here is a big DIV
}

总结

val()一般 用在input上,而不用在其他元素,用来获取input或者是select的值 html()和text()可用在多种元素上,但是html()相当于依据源代码返回,也就是在返回的内容中会包含各种tag,而text()则相当于是依据页面显示返回,返回的内容是出去各种tag之间的内容

这三个方法读取时无参,修改时有参。

$("#div").html();

$("#div").html("hello world");

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • javascript计算两个时间差

      其实,javascript计算时间差的方式非常简单,如果是默认的Date()类型,直接相减就是相差的毫秒数。

    ydymz
  • 关于thymeleaf th:replace th:include th:insert 的区别

    关于thymeleaf th:replace th:include th:insert 的区别     th:insert   :保留自己的主标签,保留th:f...

    ydymz
  • Error resolving template: template might not exist or might not be accessible是一句缩水报错?

    thymeleaf在开发的时候本地调试正常,但是在测试环境打成jar包就报这个错误了。

    ydymz
  • 雅虎邮箱被曝大规模扫描用户邮件,将数据出售给广告商

    援引华尔街日报报道,雅虎依然在扫描用户邮件并将这些数据销售给广告商,而这种行为目前已经被很多科技企业放弃。在报道中雅虎和多家广告业主进行洽谈,希望为后者提供一项...

    周俊辉
  • 雅虎邮箱被曝大规模扫描用户邮件,将数据出售给广告商

    援引华尔街日报报道,雅虎依然在扫描用户邮件并将这些数据销售给广告商,而这种行为目前已经被很多科技企业放弃。在报道中雅虎和多家广告业主进行洽谈,希望为后者提供一项...

    周俊辉
  • Jquery基本用法总结

    选择器 $("#mydiv") 通过ID $("p#myp") 选择id=myp 的所有p元素(组合型) $(".mydiv") 通过 class="mydi...

    欢醉
  • K8S线上实战课堂第二期--入门Kubernetes的Deployment/Pod/Service

    腾讯云K8S线上实战课堂,从0到1,结合方法论和实操演示,和大家一起快速入门和学习K8S和容器技术。今天推出第二期 从Hello World 了解Kuberne...

    腾讯云容器服务团队
  • PHP性能优化之连接超时如何解

    这里抛出一个常见问题:PHP环境下脚本运行超时,尤其是处理后台服务数据处理时经常会遇到。

    needrunning
  • 【漫画】七种最常见的排序算法(动图版)

    https://blog.csdn.net/qq_32799165/article/details/87878876

    用户1564362
  • 分布式技术在无人驾驶汽车中的应用

    作者:张轩博 1「自动驾驶汽车系统特点」 自动驾驶汽车是复杂的分布式系统。它结合了视觉,雷达,激光雷达,接近传感器,GPS,地图,导航,规划和控制等组件。这些不...

    企鹅号小编

扫码关注云+社区

领取腾讯云代金券