Javascript 何时使用.val（）与.innerHTML？

在JQuery中，当尝试访问元素时，我发现如果我有一个表单（比如

textarea

），并且我想在其中获取

text

，我必须使用

$（“textarea”）.val（）

相反，如果我有一个
h1
元素，我必须使用
$（“h”）[0]

为什么会这样
h1.val（）/textarea.innerHTML不起作用
您可以使用
h1.text（）
或
h1.html（）
分别映射到
innerText
和
innerHTML

至于映射到
input.value的
val（）

使用jquery等价物可以提供跨浏览器兼容性，尽管这可能更像是历史遗留问题。新浏览器可能以同样的方式实现这些功能

作为一般规则：
value
用于输入元素，
innerHTML
用于非输入字段
 因为Html中的所有输入都有val（），它们可以发送它们的值以供表单处理，例如textarea、text、submit等等

但是像h1，span这样的标签。。。不参与表单，不会被处理，而且它们可能还有内部标记和html。
.val（）
用于获取/替换jQuery中的输入元素值，JS中的替代方法是
.value

innerHTML
或jQuery的
.html（）
用于获取/替换元素中的整个标记，而不是输入元素

text（）
的用法与JS
innertHTML
几乎相同，只是它获取/替换元素中的文本，而不是所有的标记等。它基本上等同于JS
innerText

有关，，，，
的参考链接。val（）用于从jQuery中的输入元素获取值。JavaScript中的替代选项是.value

.innerHTML用于在一些标记之间放置一些值。
因此，innerHTML是一个DOM属性，用于将内容插入到元素的指定id中，使用.val（）只需从一些输入标记中获取值。
textarea.innerHTML
实际上将在最初呈现时获取textarea的html内容，而
val（）
将根据用户输入获取当前值
val（）
正如其他人所说的，它只对表单元素起作用，因此它对
没有结果


$（'textarea'）。在（'input'，function（）上{
$（'#innerhtml'）.text（this.innerhtml）；
$（'#val'）.text（$（this.val（））；
});

在下面的文本区域中键入以查看结果：


测试123
textarea innerHTML：
text区域值：
只有表单控件元素具有
value
属性，大多数其他元素具有
innerHTML
。但是有一个jQuery版本的
innerHTML
，
$（“h1”）.html（）
。但这并不能解释为什么需要使用
.val
函数？我尝试在控制台中使用它们，但它说它们不是
console.log（$（（“h1”）.text（））可以工作，但是
console.log（$（“h1”）[0].text（）doesnt@ksplitx：正确。jquery函数
text（）
etc处理jquery元素。（
$（“h1”）
在本例中）。执行
$（“h1”）[0]
时，引用jquery元素引用的第一个底层domeElement。您可以选择这两种方式，但是jquery在裸dom元素的顶部添加了一个抽象层，以使您更轻松。您仍然可以使用
$（“h1”）[0].xyz
如果您真的想这样做，您可以使用
$（“h1”）.html（）
，这与使用
$（“h1”）[0].innerHTML一样。第一个选项只是第二个选项的快捷方式，IFF
$（“h1”）
仅选择1个元素。回答得不错。。只是一个关于您的代码的问题，
上的
函数做什么？您是如何不断更新它的？jQuery
on（）
将事件处理程序附加到元素，并且
input
是
和
字段的标准DOM事件：