如何将div内文本移入input的value？为何输出[object Object]？

嘿，这个问题我之前也踩过坑，咱们一步步来理清楚：

问题根源 #

你用的$('#input').contents()返回的是一个jQuery对象集合——它包含了#input这个div里的所有子节点（比如文本节点、可能存在的子元素节点等），而不是你想要的纯文本字符串。当你直接把这个jQuery对象传给val()方法时，JavaScript会自动把对象转换为字符串，结果就成了[object Object]。

正确的解决方案 #

根据你的需求，分两种常见情况给出处理方式：

情况1：div里只有纯文本（无其他子元素） #

直接用jQuery的text()方法，它会提取元素内的所有纯文本内容：

const inputContent = $('#input').text();
$('#output').val(inputContent);

情况2：div里有HTML标签，但你只想提取纯文本 #

同样用text()就够了，它会自动忽略所有HTML标签，把所有子节点的文本合并成一个字符串返回。

额外说明：什么时候用contents()？ #

contents()一般用于需要操作元素内的具体节点时，比如你要单独修改某个文本节点，或者获取内嵌iframe的内容，这时候可以配合筛选器用：

// 筛选出#input里的所有文本节点
const textNodes = $('#input').contents().filter(function() {
  return this.nodeType === 3; // nodeType为3代表文本节点
});

但你只是要把文本移入input的value里，完全不需要这么复杂～

内容的提问来源于stack exchange，提问作者Spencer Hill