html textarea标签的innerHTML属性和value属性的区别

最新推荐文章于 2026-05-20 09:27:49 发布
原创 最新推荐文章于 2026-05-20 09:27:49 发布 · 1k 阅读 · 0 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文通过实例对比了HTML中textarea标签的innerHTML属性与value属性的差异，演示了在输入框中追加输入后的不同表现，强调了取值时更推荐使用value属性。
               

        居然有人说， html textarea标签的innerHTML属性和value属性是一致的， 我晕， 看代码：

<html><body><textarea rows="10" cols="20" id="my">AAA</textarea><button onClick="test()">test</button><script>function test(){   var obj = document.getElementById("my");   alert(obj.value);   alert(obj.innerHTML);}</script></body></html>
       此时， 我们在输入框中追加输入BBB,   然后点击按钮就可以看到， value是AAABBB, 而innerHTML是AAA， 可见含义不一致。

       区别大大的， 取值的话， 我们还是用value吧。





           

再分享一下我老师大神的人工智能教程吧。零基础！通俗易懂！风趣幽默！还带黄段子！希望你也加入到我们人工智能的队伍中来！https://blog.csdn.net/jiangjunshow

sjhfkhsf
关注
鲁棒优化入门(6)—Matlab+Yalmip两阶段鲁棒优化通用编程指南(上)
配电网和matlab的博客
08-31 1万+
Matlab+Yalmip两阶段鲁棒优化通用编程指南(上篇)，内容包括： ①.拿到一个复杂的两阶段鲁棒优化问题的分析步骤和方法。 ②.采用Yalmip工具箱中的uncertain函数和鲁棒优化模块求解两阶段鲁棒优化的子问题。 ③.Yalmip工具箱中的鲁棒优化模块和常规的求解思路有什么异同。 ④.使用KKT条件求解两阶段鲁棒优化的子问题，并使用C&CG算法进行迭代求解。
避坑指南：DDR4内存条Margin测试Fail？从Intel RMT工具到PCB Layout的完整排错思路
最新发布
weixin_42530458的博客
05-20 338
本文深入探讨了DDR4内存条在Margin测试中Fail的完整排错思路，从Intel RMT工具分析到PCB Layout优化。通过实战案例，详细解析了信号完整性问题的诊断与解决方案，包括拓扑结构影响、传输线参数优化及HyperLynx仿真验证，为硬件设计工程师提供了宝贵的避坑指南。
关于textarea的innerHTML和value
boooch的专栏
09-15 2204
顾名思义：要想显示html效果，就要用innerHTML，如果只是赋值，就用value好了。但是innerHTML似乎不显示回车效果，用,/n都不行，如果谁有好的方法，可以告诉偶哦~value就可以用/n轻松的添加回车了。但是不要试图添加value在textarea中，这是无效的，参见如下代码：PS：textarea在html中书写时不要照顾格式对齐之类的 否则会把那些空格tab啥的 全都包含到innerHTML中，容易判断失误。PS：onclick事件在js中书写规矩是obj.onclick=某funct
锂电池寿命预测 | Pytorch实现基于Transformer 的锂电池寿命预测（NASA数据集）
算法如诗的博客
03-04 5511
锂电池寿命预测 | Pytorch实现基于Transformer 的锂电池寿命预测（NASA数据集）
textarea的value与innerHTML
二拾三年
11-16 1705
问题的来由今天有一位朋友问到关于 textarea标签的问题，开始时我不以为意。因为在我看来，因为这是一个很简单的标签，它表示一个可增删字符的文本域，可以利用 textarea 的 placeholder 和 value 属性来做一些适当的操作;用 cols rows 控制 列数，行数（当然，更好是用CSS的width和height）……嗯，就这些了。不过，你可以先看看下面的代码：<textarea
textarea 中的 innerHTML 和 value
weixin_33836223的博客
12-28 301
&lt;textarea&gt;&lt;/textarea&gt; &lt;input type="button" value="click" /&gt; &lt;script&gt; document.querySelector("input[type='button']").addEventListener("click", function() {
textarea标签value与innerHTML
Cosmoshfx的博客
03-10 1104
textarea标签没有value属性，若想在文本区显示默认文本，可以直接写，如下： <textarea cols="30" rows="10" name="文本区" id="area">你好呀</textarea> 或在js中使用 document.getElementById('area').value='你好呀‘ 都可以在文本区显示输入的文字，如下图所示： 但是不能使用.innerHTML进行赋值，是无效的，我也不太明白为什么，只知道是这样的结果，有大神知道的话麻烦评论哈。
html之textarea标签的innerHTML属性和value属性获取值的区别
程序羊的博客
10-18 1141
注意： html中textarea标签的innerHTML属性和value属性获取值是不一致的！ 示例代码如下： <html> <body> <textarea rows="10" cols="20" id="my"> AAA </textarea> <button onClick="test()">test</button...
获取textarea中的值用value和innerHTML的区别
a709647488的博客
12-06 471
今天在做一个文字移动的小东西的时候发现一些特点： 1、除了表单元素，其它的标签在浏览器页面中都是不可写的。 2、 textarea 用value可以获取当前的textarea中的值 而innerHTML获取的是一开始的页面中的值，从文档中获取 经测试发现，当我们浏览器显示的页面上修改textarea中的值的时候， 实际上文档里的内容还是没有改变的（通过审查元素可...
js中value、innerHTML、innerText的区别
zag666的博客
11-23 1481
value value是表单元素特有的属性，输入输出的是转义文本(字符串)。 可以用来修改（获取）textarea和input的value等表单属性的值或元素的内容。 innerHTML innerHTML用来修改（获取）HTML元素（如div）html格式的内容。 innerHtml是div标签内的文本，输入输出到该DOM内部纯HTML代码（获得td、div等html元素时，他们没有val...
js 中 innerHTML 和 value
weixin_54362826的博客
03-25 203
innerHTML 和 value innerHTML 是标签内的 html 文本，输入输出的是该 DOM 内部纯 html 代码 例如：<div> <button> <span> value 是表单控件的值，输入输出的是字符串 有 value 属性的标签，才能用 value 求值 例如：<input> <textarea> textarea 标签求值，即可用 innerHTML，也可用value ...
JavaScript-6-innerHTML、innerText、value、valueOf的区别（简单计算器小例子）
qq_38328762的博客
08-22 402
操作表单元素的文本内容用value；而innerHTML与innerText操作非表单元素的内容或文本内容 innerHTML：获取双闭合标签里面的html内容，并且要识别标签。 innerText：获取双闭合标签里面的文本内容，不会识别html标签。 value是表单元素的特有属性，非表单元素没有value属性，如div，span等。 value在不同表单元素里有不同的意义，如button为按...
被玩坏的innerHTML、innerText、textContent和value属性
shueiyuan1983的专栏
10-28 5015
一、前言　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　   由于innerText并非W3C标准属性，因此我们无法在FireFox中使用它，一般情况下我们可以使用textContent来代替，但它两者是否就能完全等同呢？在坑爹的表单元素（如input、textarea等）中表现是否依旧诡异呢？文本将记录一些实验结果，避免日后被玩坏。   二、innerHTML　　　
Value与innerHTML区别
zza000000的博客
11-29 2904
W3C中innerHTML定义为：innerHTML属性设置或返回表格行的开始和结束标签之间的HTML，看清楚，是两个标签之间的HTML；value为：Attr 对象表示 HTML 属性，attr.value为设置或返回属性的值。因此一个是标签的属性，是改变标签的内容， 一个是标签的属性值，是改变标签的属性的属性的值。所以innerHTML和value用法 和作用就明确了； 有些标签没有内容只
Web前端之textarea文本域标签元素、回车与换行符介绍、禁止事件冒泡、清除、清空、重置、赋值、stopPropagation、querySelector、innerHTML、replace、br
热门推荐
CSDN博客主页地址：https://mengjian.blog.csdn.net/
06-01 1万+
Web前端之textarea文本域标签元素、回车与换行符介绍、禁止事件冒泡、清除、清空、重置、赋值、stopPropagation、querySelector、innerHTML、replace、br
javascript取值的时候什么时候用value什么时候用innerHTML
Catherine_G的博客
01-18 1103
对于表单控件(输入类),都可以用value属性,对于非表单控件（非输入类eg：div, span,em）,可以用innerHTML INPUT标签都有value属性,但都没有innerHTML属性,所以只能用valueSELECT标签和OPTION标签,即有value属性也有innerHTML属性,但是一个是取回值,一个是取回文本,这两个可能相同也可能不同,具体要看你想要哪个值.TEXTAREA标
value、innerHTML、 innerText
weixin_30713953的博客
07-15 112
//动态设置value值 var input = document.getElementsByTagName('input')[0]; input.value = '要下雨了！'; console.log(input.value); console.log(input); var textarea = document.getElementsByTagName('textar...
html5 控件赋值,jquery给textarea赋值
weixin_32029321的博客
06-10 1513
html中怎样给textarea赋值？html中给textarea赋值比较常见的方式：1.html中直接书写；2.通过JS动态修改； 第一种：JQuery给textarea取值和赋值:取值 var qrcodefortemcontent=$("#qrcodefortemcontent").val()。赋值 $("#qrcodefortemcontent").val(“123”);。textarea...
innerHTML，innerText，textContent和value的不同之处
gechen517的博客
12-17 1198
当我们想要取出一段页面中的文本的时候，有时在使用innerHTML，innerText，textContent和value中的任何一个方法取出的值是一样的，这时会给使用者一种错觉，他们的作用是一样的，但是这是真的吗？ 那么接下来我们来了解下innerHTML，innerText，textContent和value分别是什么 ###1.innerHTML ...
JDSoft_SurfMill9.5_X64_Setup01_1109.exe
JDSoft_SurfMill9.5_X64_Setup01_1109.exe
u-blox通信协议
u-blox通信协议
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值