JavaScript入门示例：新窗口动态显示提交内容源码

本文档主要介绍了如何使用JavaScript编写一个简单的代码片段，用于在新窗口中显示用户提交的内容。该示例适合初学者学习JavaScript的基础操作，特别是涉及到窗口打开、页面通信以及表单提交的概念。 1. **JavaScript基础知识**： - JavaScript 是一种轻量级的脚本语言，常用于网页前端开发，它可以在浏览器环境中运行，实现与用户的动态交互。 2. **新窗口（Window）操作**： - `window.open()` 方法用于创建一个新的浏览器窗口。在这个例子中，`about:blank` 参数指定新开窗口加载空白页面，参数 `"choose_window"` 是窗口的名称或ID，可以用来引用这个窗口对象。如果窗口已经存在且未关闭，`window.open()` 将返回已有的窗口。 3. **事件处理函数 (`onclick`)**： - 函数 `show_choose()` 被绑定到表单的提交按钮上。当用户点击按钮时，会执行相应的代码。`window.location='about:OK'` 语句将新窗口重定向到一个空白页，`opener.focus();window.close()` 分别聚焦到父窗口并关闭新窗口。 4. **窗口文档操作 (`document` 对象)**： - `win.document` 指向新窗口的文档对象，通过它来操作新窗口中的HTML内容。`document.write()` 方法用于向窗口添加HTML文本，这里使用了变量 `new_html` 包含两个按钮元素，允许用户关闭窗口或者返回到父窗口。 5. **表单提交 (`FORM` 标签)**： - `<FORM>` 标签定义了一个表单，其 `action` 属性设置为 `javascript:show_choose()`，意味着当用户提交表单时，会触发 `show_choose()` 函数的执行。`method` 属性设为 `post`，表明数据是以POST方式发送。 6. **HTML结构 (`<INPUT>` 标签)**： - 表单中包含一个输入框 (`<INPUT id=the_text>`) 和两个提交按钮。用户可以在输入框中输入内容，点击 "ύ" 按钮后，这些内容会在新窗口中显示。 总结来说，这份源码展示了如何通过JavaScript在用户提交表单后，在新窗口中动态显示内容，并提供了关闭窗口和返回原窗口的选项。这对于理解JavaScript的DOM操作、事件处理和基本的窗口管理有很好的教学价值。