关于val(),text(),html()的用法

最新推荐文章于 2020-06-01 21:01:33 发布
最新推荐文章于 2020-06-01 21:01:33 发布
阅读量79 收藏
点赞数
文章标签： javascript ViewUI

直接上demo：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<!--http://localhost:8080/ssh_easyui/test/findAndChildern.html-->
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <script type="text/javascript" src="../js/easyui/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">

        function valTest() {
            console.info($("#input").val());
        }

        function htmlTest() {
            var result2=$("#tb>tbody").find("tr:eq(1)").html();
            console.info(result2);
        }

        function textTest(){
            var result = $("#tb>tbody").find("tr:eq(1)").text();
            console.info(result);
        }

    </script>
</head>
<body>
Value:<input id="input" type="text" value="LOVE"/>
<table border="1" id="tb">
    <tr>
        <td>编号</td>
        <td>姓名</td>
        <td>年龄</td>
        <td>性别</td>
    </tr>
    <tr>
        <td>1</td>
        <td>诺伊</td>
        <td>18</td>
        <td>女</td>
    </tr>
    <tr>
        <td>2</td>
        <td>王点点</td>
        <td>22</td>
        <td>女</td>
    </tr>
    <tr>
        <td><input type="button" onclick="valTest()" value="测试val()"></td>
        <td><input type="button" onclick="htmlTest()" value="测试html()"></td>
        <td><input type="button" onclick="textTest()" value="测试text()"></td>
    </tr>
</table>
</body>
</html>

相应点击后结果如图所示：

综上：

1.val()是对于单标签元素的值，其中一个很重要的特性就是value=""
2.text()是选择所选元素的文本，没有相应的html
3.html()是选中所选元素的html，可能有html元素。

 

???Sir
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
『jQuery』.html(),.text()和.val()的概述及使用
10-27
如何使用jQuery中的.html(),.text()和.val()三种方法，用于读取，修改元素的html结构，元素的文本内容，以及表单元素的value值的方法
text(), val(), html()的区别
qq_44427343的博客
06-04 257
1. text()可以用来返回span，td，以及div等标签的内容，不会返回input中value的内容。 2. val()可以用来返回input中value的内容，不会返span，td，以及div等标签的内容 3. html()不但可以用于html元素文本内容的存取，还可以用于html内容的存取。 ...
『jQuery』.html(),.text()和.val()的使用
weixin_30443731的博客
04-21 1626
本节内容主要介绍的是如何使用jQuery中的.html(),.text()和.val()三种方法，用于读取，修改元素的html结构，元素的文本内容，以及表单元素的value值的方法。jQuery中为我们提供了多种方法用于对元素的HTML结构和元素的文本内容的操作，比如说，你可以给已存在的元素的内部，周围，前面或者后面增加新元素；或者用一个元素替代另一个元素；你也可以读取或者修改一个元素的内容或...
js中的val() 和 text() html() 区别
丿kiss灬火舞的博客
02-01 5271
共同点：text()，html() ，val()三个方法用于html元素的存值和取值。 区别： text()用于html元素文本内容的存取 html()不但可以用于html元素文本内容的存取，还可以用于html内容的存取 val()用于input元素内容的存取 示例如下： &lt;body&gt; &lt;p&gt;我们&lt;/p&gt; &lt;input type="text" valu...
val()和text()
okela1985851010的专栏
04-17 221
今天下午被一段js代码搞疯了，写了无数个alert，最后终于发现问题的所在，原来是有一处input中的value取值用了text(). google了下，查了查前辈的经验。text()可以取的所有匹配元素的文本，val()用于取的值。 看了看jquery的api是这样解释的。 text()取得所有匹配元素的内容。结果是由所有匹配元素包含的文本内容组合起来的文本。...
JQuery中的.val()、.html()、.text()
ssssSFN的博客
05-05 477
.val() 获取标签中的value属性值 <body> <div id="div1">div有文本内容</div> <div id="div2"> div2内的文本 <span>span内有文本内容</span> </div> <input t...
浅析JQuery中的html(),text(),val()区别
10-25
在jQuery中，`html()`, `text()`, 和 `val()` 是三个非常重要的方法，它们分别用于处理元素的不同类型的内部内容。这些方法在前端开发中经常被使用，以实现对DOM元素的动态操作。 1. **html()** - `.html()` 方法...
jQuery中text() val()和html()的区别实例详解
11-25
总的来说，理解jQuery中`text()`, `val()`, 和 `html()` 的区别是优化DOM操作的关键，它们各自有其特定的应用场景，熟练掌握它们的用法可以提高前端开发的效率。在实际工作中，根据需求正确选择这些方法，能帮助我们...
jquery 学习之二 属性 文本与值(text,val)
10-28
在jQuery中，`text()`和`val()`是两个非常重要的方法，用于处理元素的文本内容和值。它们是jQuery库中用于操作DOM元素内容的便捷工具，尤其在动态更新页面或处理用户输入时非常有用。 1. `text()`方法： - `text()...
jquery中html、val与text三者属性取值的联系与区别介绍
12-01
在jQuery中，`html()`, `val()`, 和 `text()` 是三个常用的方法，它们用于获取和设置HTML元素中的内容。下面将详细解释这三个方法的联系与区别。 1. `html()` - 无参 `html()`：该方法用于获取匹配元素的第一个...
JQ 获取和设置内容 text() html() val()
08-14
本篇文章将详细讲解jQuery中获取和设置内容的三个主要方法：`text()`, `html()`, 和 `val()`。这些方法在网页动态交互和数据处理中扮演着至关重要的角色。 首先，`text()`方法用于获取或设置元素的文本内容。当你想...
Jquery使用val方法读写value值
12-10
本文实例讲述了Jquery使用val方法读写value值。分享给大家供大家参考。具体如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
妙用Jquery的val()方法
10-28
首先，val()方法的基本用法是在jQuery对象上调用，用于获取或设置元素的值。对于输入类型的元素，如文本框（`<input type="text">`），可以这样使用： ```javascript // 获取文本框的值 var txtValue = $("#address...
jQuery获取文本节点之 text()/val()/html() 方法区别
10-28
在jQuery中，`text()`, `val()`, 和 `html()` 是三个常用的方法，用于获取和设置元素的文本内容、值以及HTML结构。虽然它们在某些方面有相似之处，但各自有着独特的功能和应用场景。 首先，`html()` 方法主要用于...
jQuery操作attr、prop、val()/text()/html()、class属性
12-02
本篇文章将详细讲解jQuery中的`attr`、`prop`、`val()`/`text()`/`html()`以及`class`属性的操作。 1. **attr操作** - **设置单个属性**：使用`$obj.attr(name, value)`，其中`name`是需要设置的属性名，`value`是...
.html(),.text()和.val()的差异总结：
Flora的博客
11-17 471
.html(),.text(),.val()三种方法都是用来读取选定元素的内容.html()是用来读取元素的html内容（包括html标签），.text()用来读取元素的纯文本内容，包括其后代元素，.val()是用来读取表单元素的”value”值。其中.html()和.text()方法不能使用在表单元素上,而.val()只能使用在表单元素上；另外.html()方法使用在多个元素上时，只读取第一个元素
.html(),.text()和.val()的差异总结
weixin_44541250的博客
04-18 3855
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~开发工具与关键技术：DW作者：张海锋撰写时间：2019-04-10~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ .html() .text() .val()三种方法都是用...
val和text取值
磨镜台的博客
05-17 362
获取Input标签的值使用val $('.input_show').val() 获取非input标签的值用text $('.num').text()
text()和val()的区别
RoyalLAW的博客
06-01 1243
text()用来返回span以及div标签中的内容，不会返回input中value的内容。 val()用来返回input中value的内容，不会返回div以及span标签中的内容
通过 jQuery分别举例实现获取和设置内容：text()、html() 、 val()、attr()
最新发布
06-08
好的，下面是四个方法的使用示例： 1. 获取和设置文本内容： 获取文本内容： ```javascript var text = $("p").text(); ``` 设置文本内容： ```javascript $("p").text("Hello World!"); ``` 2. 获取和设置 ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值