gpt4 book ai didi

javascript [对象 HTMLParagraphElement] 问题

转载 作者:行者123 更新时间:2023-12-03 07:09:53 25 4
gpt4 key购买 nike

Javascript 编程新手
我想从 textarea 获取文本并添加 html 段落标签,但我在 html 中遇到问题
[对象 HTMLParagraphElement]

const textArea = document.querySelector("#textAreag");
const edit = document.querySelector(".buttonEdit");
var itemss = document.querySelector(".items");

function action() {
let itemvalue = textArea.value;
var addPTag = document.createElement("p");
var pValue = document.createTextNode(itemvalue);
addPTag.appendChild(pValue);
console.log(addPTag);
itemss.innerHTML = addPTag;
}
edit.addEventListener("click", action, false);
<!DOCTYPE html>
<html lang="en-US" dir="ltr">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Project Online To Do List</title>
<link rel="stylesheet" href="styles.css">
</head>

<body>
<section class="MainHtmlHeading">
<textarea id="textAreag" name="EditableArea" rows="2" cols="80"></textarea>
<button class="buttonEdit" type="button" name="button">Edit</button>
</section>

<h1>To Do List</h1>
<section class="items">

</section>
</body>

</html>

最佳答案

使用appendChild将段落添加到该部分。当您分配给 innerHTML ,值应该是 HTML 字符串,而不是 DOM 元素。

const textArea = document.querySelector("#textAreag");
const edit = document.querySelector(".buttonEdit");
var itemss = document.querySelector(".items");

function action() {
let itemvalue = textArea.value;
var addPTag = document.createElement("p");
var pValue = document.createTextNode(itemvalue);
addPTag.appendChild(pValue);
console.log(addPTag);
itemss.appendChild(addPTag);
}
edit.addEventListener("click", action, false);
<!DOCTYPE html>
<html lang="en-US" dir="ltr">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Project Online To Do List</title>
<link rel="stylesheet" href="styles.css">
</head>

<body>
<section class="MainHtmlHeading">
<textarea id="textAreag" name="EditableArea" rows="2" cols="80"></textarea>
<button class="buttonEdit" type="button" name="button">Edit</button>
</section>

<h1>To Do List</h1>
<section class="items">

</section>
</body>

</html>

关于javascript [对象 HTMLParagraphElement] 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64826901/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com