Javascript 将文本从div innerHtml复制到textarea

与iframe问题相关的问题：

我正在尝试将InnerHtml从div复制到TextArea。 我在同一个网页上创建了两个google translator实例，我正在尝试将第一个实例的自动更正应用于第二个实例，而不更改第一个

textarea

我尝试了不同的代码：

setInterval(function() {
childAnchors1 = document.querySelectorAll("#spelling-correction > a")[0];
$("#source")[1].val(childAnchors1.text());
 }, 100);

---

---

---

---

---

但不幸的是，这一切似乎都不起作用

我将非常感谢任何帮助

我应该提到这一点。我使用iframe创建第二个实例，所以简单的解决方案不起作用。。。 这是我用来创建iframe实例的代码：

var makediv = document.createElement("secondinstance");
makediv.innerHTML = '<iframe id="iframenaturalID" width="1500" height="300" src="https://translate.google.com"></iframe>';
makediv.setAttribute("id", "iframeID");
var NewTranslator = document.getElementById("secondinstance");
var getRef = document.getElementById("gt-c");
var parentDiv = getRef.parentNode;
parentDiv.insertBefore(makediv, getRef);

但它不起作用

好的，我通过以下方式实现了：

var a = document.createElement('iframe');
a.src = "https://translate.google.com"; 
a.id = "iframenaturalID";
a.width = "1000";
a.height = "500";
document.querySelector('body').appendChild(a)

及

现在它执行了我尝试执行的操作，但仍然收到错误消息：

uncaughttypeerror:cannotsetproperty'value'为null
在eval，它指向此行：
source.value=destination.textContent。虽然这不是一个大问题，但它返回这个错误仍然很奇怪

好的，我可以通过添加
setTimeout
来解决这个问题。您尝试过的所有代码中的问题都是如何正确获取文本

从您的第一个示例开始应该使用
innerText
而不是
text（）
，因为它是一个jquery对象，您返回的是一个DOM对象而不是jquery对象：

setInterval(function() {
    childAnchors1 = document.querySelectorAll("#spelling-correction > a")[0];
    $("#source")[1].val(childAnchors1.innerText);
}, 100);

在第二个示例和第三个示例中，需要从
内部文本中删除括号，如：

setInterval(function copyText() {
    $(".goog-textarea short_text")[1].val($("#spelling-correction > a")[0].innerText);
}, 100);

我建议使用纯js和
textContent
属性，如：

setInterval(function() {
    var childAnchors1 = document.querySelectorAll("#spelling-correction > a")[0];
    document.querySelectorAll("#source")[1].value = childAnchors1.textContent;
}, 100);


注意：我应该指出，您的HTML代码无效，因为在同一文档中，
id
属性应该是唯一的时候，您使用的是重复标识符。
您尝试过的所有代码中的问题都是如何正确获取文本

从您的第一个示例开始应该使用
innerText
而不是
text（）
，因为它是一个jquery对象，您返回的是一个DOM对象而不是jquery对象：

setInterval(function() {
    childAnchors1 = document.querySelectorAll("#spelling-correction > a")[0];
    $("#source")[1].val(childAnchors1.innerText);
}, 100);

在第二个示例和第三个示例中，需要从
内部文本中删除括号，如：

setInterval(function copyText() {
    $(".goog-textarea short_text")[1].val($("#spelling-correction > a")[0].innerText);
}, 100);

我建议使用纯js和
textContent
属性，如：

setInterval(function() {
    var childAnchors1 = document.querySelectorAll("#spelling-correction > a")[0];
    document.querySelectorAll("#source")[1].value = childAnchors1.textContent;
}, 100);


注意：我应该指出，您的HTML代码无效，因为在同一文档中，
id
属性应该是唯一的时候，您使用的是重复的标识符。
因为
textarea
是表单元素，所以
.innerText
或
.innerHTML
都不起作用。您需要使用
值
属性（或使用JQuery的
.val（）
提取其内容）。

及供参考：


它是
innerText
，而不是
。innerText
.innerText
是一个属性，而不是一个函数，因此在它之后不使用
（）
它是
.innerHTML
，而不是
.innerHTML
innerHTML
在字符串中有HTML时使用
解析为HTML和
。textContent
用于不应
被解析为HTML。通常，您不会将其中的内容映射到
其他的
document.querySelectorAll（）
扫描整个DOM以查找所有
匹配节点。如果您知道只有一个匹配节点，或者
只需要第一个匹配的节点，这是对资源的浪费。
相反，请使用
.querySelector（）
，它会在
找到第一个匹配项。
因为您使用的是JQuery，所以在使用时应该保持一致。对于JQuery，不需要使用
.querySelector（）
或
.queryselectoral（）
，只需使用JQuery选择器语法即可

下面的示例显示了香草JavaScript和JQuery方法，它们使用您在问题中显示的HTML类型，使用与您显示的相同的
id
值和嵌套结构。您可以看到，我正在使用不同的选择器来正确定位输入/输出元素


//是获取标准DOM对象的DOM查询
让source=document.getElementById（“source”）；
让destination=document.querySelector（“拼写更正>a”）；
//获取JQuery对象的JQuery语法：
让jSource=$（“#source”）；
让jDestination=$（“#拼写更正>a”）；
//一种设置事件处理程序并完成工作的方式
source.addEventListener（“keyup”，function（））{
destination.textContent=source.value；
});
//JQuery是一种设置事件处理程序并完成工作的方法
on（“keyup”，function（））{
text（jSource.val（））；
});
textarea，div{
边框：3倍纯色灰色；
宽度：500px；
高度：75px；
字号：1.5em；
字体系列：Arial、Helvetica、无衬线字体；
}
.destination{指针事件：无；背景：#e0；}

在第一个文本区域中键入

你是说：
由于
文本区域是表单元素，因此
.innerText
或
.innerHTML
都不起作用。您需要使用
值
属性（或使用JQuery的
.val（）
提取其内容）。

及供参考：


它是
innerText
，而不是
。innerText
.innerText
是一个属性，而不是一个函数，因此在它之后不使用
（）
它是
.innerHTML
，而不是
.innerHTML
innerHTML
在字符串中有HTML时使用
解析为HTML和
。textContent
用于不应
被解析为HTML。通常，您不会将其中的内容映射到
其他的
document.querySelectorAll（）
扫描整个DOM以查找所有
匹配节点。如果您知道只有一个匹配节点，或者
只需要第一个匹配节点，这是浪费资源
setInterval(function() {
    childAnchors1 = document.querySelectorAll("#spelling-correction > a")[0];
    $("#source")[1].val(childAnchors1.innerText);
}, 100);

setInterval(function copyText() {
    $(".goog-textarea short_text")[1].val($("#spelling-correction > a")[0].innerText);
}, 100);

setInterval(function() {
    var childAnchors1 = document.querySelectorAll("#spelling-correction > a")[0];
    document.querySelectorAll("#source")[1].value = childAnchors1.textContent;
}, 100);