有没有办法使用HTML文本区域的输入来填充堆栈或数组？

数据处理: 当需要从用户输入中提取一系列数据并进行进一步处理时。
配置管理: 用户可以通过文本区域输入配置项，程序将其解析并应用到系统中。
日志分析: 用户可以粘贴日志文件内容，程序将其分割并逐行处理。

可以使用HTML文本区域的输入来填充堆栈或数组。以下是一个简单的示例，展示了如何将HTML文本区域的输入分割成数组，并将其元素逐个压入堆栈中。

HTML部分

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Text Area to Stack/Array</title>
</head>
<body>
    <textarea id="inputArea" rows="4" cols="50" placeholder="Enter items separated by commas"></textarea>
    <button onclick="processInput()">Process Input</button>
    <div id="output"></div>

    <script src="script.js"></script>
</body>
</html>

JavaScript部分（script.js）

function processInput() {
    const inputArea = document.getElementById('inputArea');
    const inputValue = inputArea.value;
    const itemsArray = inputValue.split(',').map(item => item.trim()); // Split by comma and trim whitespace

    const stack = [];
    for (const item of itemsArray) {
        stack.push(item);
    }

    displayResult(stack);
}

function displayResult(stack) {
    const outputDiv = document.getElementById('output');
    outputDiv.innerHTML = `<p>Stack contents:</p><ul>${stack.map(item => `<li>${item}</li>`).join('')}</ul>`;
}

解释

HTML部分:
- 创建一个<textarea>元素用于用户输入。
- 添加一个按钮，当点击时调用processInput函数。
- 使用一个<div>元素来显示处理后的结果。

JavaScript部分:
- processInput函数获取文本区域的值，并使用split(',')方法将其分割成一个数组。每个元素通过map方法去除前后空白。
- 创建一个空数组stack，并使用for...of循环将处理后的每个元素压入堆栈。
- displayResult函数用于在页面上显示堆栈的内容。