deveco studio页面添加输入框 输入文字 单击按钮 文字显示在页面上

Deveco Studio是一个用于网页开发的工具，如果你想在页面上添加一个输入框，让用户可以输入文字，并通过单击按钮将输入的内容显示出来，你可以按照以下步骤操作：

1. **创建HTML元素**:
- 使用`<input>`标签创建一个文本输入框，例如:

     <input type="text" id="inputField" placeholder="请输入文字">

- 创建一个按钮，通常用`<button>`标签，如:

     <button onclick="displayInput()">点击显示</button>

2. **JavaScript事件处理**:
- 使用JavaScript来监听按钮的点击事件并获取输入框中的内容。可以在`onclick`属性的函数里实现这个功能，例如：

     function displayInput() {
       var textField = document.getElementById("inputField");
       var userInput = textField.value;
       // 显示用户输入
       alert("您输入的文字是: " + userInput);
       // 或者你可以修改DOM结构将输入显示在某个指定位置
       // document.getElementById("outputArea").innerText = userInput;
     }

- 上述代码会在用户点击按钮后弹出一个警告框显示输入的文字，如果需要实时显示在页面上，可以替换`alert`为修改`document.getElementById("outputArea")`的`innerText`。