val() 和 text() 的区别

IT技术 javascript jquery html
2021-01-16 14:15:07

jQuery 的函数val()text()?

你会在哪里使用一个?

4个回答

.val()适用于输入元素(或任何具有 value 属性的元素?)并且.text()不适用于输入元素。 .val()获取输入元素的值——无论类型如何。.text()获取所有匹配元素的innerText(不是HTML):

.text()

结果是一个字符串,其中包含所有匹配元素的组合文本内容。此方法适用于 HTML 和 XML 文档。不能用于输入元素。对于输入字段文本,请使用 val 属性。

.val()

获取第一个匹配元素的value属性的内容

不要使用 textarea.html('content') 加载内容。我使用 jQuery dynamic 加载了一些内容 - 有趣的部分是当我单击保存按钮时。在那个动作之后,textarea 中的内容不再改变。使用 .val('content') 设置内容没有出现这个问题。不知道为什么,但我认为这与 DOM 缓存和这两种方法的不同行为有关。
2021-03-23 14:15:07
有趣的事情 - 考虑到他们可能不相等 textarea someTextArea.html() !== someTextArea.val()
2021-04-06 14:15:07

text() 返回所有匹配元素(如p、div 等)的组合文本内容 val() 用于获取输入元素(如input、select 等)的值

根据官方文档 text() 不应与输入元素一起使用

val() 用于从所有 html 输入类型(如(复选框、文本等)中获取值,其中用户可以选择输入值。 前任:-

<input type="text" id="txt_name" /> 
 <input type="checkbox" name="vehicle" value="Bike" id="chk_byk" class="ss">bike<br>   
<script type="text/javascript">
 $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#chk_byk").val());
            });

            });


    </script> 

其中 text() 用于从用户不会进行交互的 html 元素中获取值(p、div 等)

    <p id="p1">Hi how are u??</p>
 <div id="dv5">Debendra</div>

 <script type="text/javascript">

        $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#dv5").text());
            });

            });


    </script>

.val() 函数从输入元素返回值,.text() 函数从非输入元素返回值。我们还可以将字符串参数传递给这些函数来设置调用元素的值下面的代码显示了如何使用 .val() 和 .text() 函数为 DOM 元素设置值:

HTML部分:

<form id="form1"><input id="first" type="text" /><input type="submit" /></form>
<div id="second">Click the "Submit Query" to see it work</div>

Jquery部分:

$(document).on("submit", "form", function (e) {
    $("#first").val("This input is set by .val() function");
    $("#second").text("A new text is set using .text() function!");
    return false;
})

演示:http : //jsfiddle.net/urhys9zj/6/