<html>
<head>
<title>TEST</title>
<script type="text/javascript">
function add(){
var form1 = document.getElementById("form1");
var parentNode = document.getElementById("users");
//生成textNode对象
var tn1Obj = document.createTextNode(form1.user.value);
var tn2Obj = document.createTextNode(form1.email.value);
var tn3Obj = document.createTextNode(form1.tel.value);
var tn4Obj = document.createTextNode("DEL");
//生成td对象
var td1Obj = document.createElement("td");
var td2Obj = document.createElement("td");
var td3Obj = document.createElement("td");
var td4Obj = document.createElement("td");
td1Obj.appendChild(tn1Obj);
td2Obj.appendChild(tn2Obj);
td3Obj.appendChild(tn3Obj);
td4Obj.appendChild(tn4Obj);
//生成tr对象
var trObj = document.createElement("tr");
trObj.appendChild(td1Obj);
trObj.appendChild(td2Obj);
trObj.appendChild(td3Obj);
trObj.appendChild(td4Obj);
parentNode.appendChild(trObj);
}
function del(x){
var y = x.parentNode;
var z = x.parentNode.parentNode;
z.removeChild(y);
}
</script>
</head>
<body>
[align=center]
添加用户
<form action="" id="form1">
用户 <input type="text" id="user" />
email <input type="text" name="email" />
电话 <input type="text" name="tel" />
<input type="button" onclick="add()" value="添加">
</form>
[/align]
<hr>
[align=center]
<table id="users" border="1">
<tr>
<td>tom</td>
<td>tom@tom.com</td>
<td>500</td>
<td onclick="del(this)"><font color="red">DEL</font></td>
</tr>
<tr>
<td>Jerry</td>
<td>Jerry@tom.com</td>
<td>600</td>
<td onclick="del(this)"><font color="red">DEL</font></td>
</tr>
</table>
[/align]
</body>
</html>
分享到：
相关推荐
`jsdom` 是一个JavaScript实现的DOM（文档对象模型）库，它允许在Node.js环境中运行浏览器的API。这个开源项目为开发者提供了在服务端操作和解析HTML与XML文档的能力，尤其在进行自动化测试、数据抓取或模拟浏览器...
开玩笑的环境jsdom十六Jest v26随JSDOM @ 16一起提供，因此没有理由使用此软件包 v25默认情况下使用 15支持 。此软件包还应该与Jest 24及更早版本兼容。 该软件包随JSDOM v16一起提供，它还支持。 如果您需要比Jest...
业力-jsdom-launcher 启动器。 安装 npm install karma-jsdom-launcher --save-dev 注意： karma和jsdom是此模块的peerDependencies。 如果尚未安装，请运行 npm install karma-jsdom-launcher jsdom karma --save...
这个压缩包"js-dom-and-events-modifying-html-readme-v-000-源码.rar"包含的源码很可能是一系列关于使用JavaScript操作DOM和处理事件的示例。 **DOM基础** DOM是一个树形结构，其中每个节点代表HTML文档的一部分...
domtoimage图片下载插件,用于将dom节点转换成图片,然后就可以下载下来
3. **操作DOM**：DOM提供了一系列方法，允许我们添加、删除或修改节点。在学生成绩管理系统中，可能需要添加新的学生记录、更新成绩或者删除已有的学生信息。 4. **保存更改**：完成对DOM的操作后，我们需要将更改...
**前端开源库-dom-element-watcher** 是一个专为前端开发者设计的轻量级库，它的主要功能是**监视DOM元素的变化**。在Web开发中，DOM（文档对象模型）是HTML或XML文档的结构化表示，它允许JavaScript与网页内容进行...
JavaScript-DOM-交互式和动态JavaScript JavaScript DOM的代码存储库-交互式和动态JavaScript，由Packt发布 JavaScript DOM-交互式和动态JavaScript 这是发布的的代码存储库。 它包含从头到尾完成视频课程所需的...
jsdom-testing-mocks 一组用于在jsdom环境中模拟浏览器行为的工具 安装 npm install --save-dev jsdom-testing-mocks 或者 yarn add -D jsdom-testing-mocks 模拟视口 模拟matchMedia ，允许根据视口描述测试组件的...
dom.js - DOM JavaScript javascript javascript javascript javascript javascript
- **错误处理**：添加适当的错误处理机制，比如当DOM元素不存在或者JavaScript执行失败时，能够给出清晰的反馈。 文件"dom-to-image说明.docx"可能包含关于如何使用dom-to-image库的详细说明，而"dom-to-image.js...
dom到pdf dom-to-pdf使用HTML5 canvas和svg从DOM节点生成可打印的PDF。 安装 npm install --save dom-to-pdf 用法 var domToPdf = require ( 'dom-to-pdf' ) ; var element = document . getElementById ( 'test' )...
原生JavaScript提供了一种方法来实现这种父子页面间的DOM元素获取与操作。 首先，我们需要了解iframe元素的基本特性。iframe元素中的内容对于外部页面来说是隔离的，有自己的DOM树和执行上下文。因此，直接操作...
JavaScript和DOM操作-第10周 第10周研究：列出并说明使我们能够从DOM中选择元素JavaScript方法。 什么是文件对象？ 没有从DOM中选择元素的文档对象上还有哪些其他可用方法？ 您本周学到的最喜欢的东西是什么？ ...
笑话环境jsdom最新 在Jest环境中使用最新的jsdom API和功能。 安装 npm install jest-environment-jsdom-latest 用法 在index.spec.js或任何版本中： /** * @jest -environment jsdom-latest */ test ( 'use the...
通过JavaScript，我们可以获取这些节点，改变它们的属性，添加或删除子节点，甚至移动节点，从而更新页面内容。 例如，`document.getElementById()`方法是DOM操作的基础，它允许我们通过元素ID找到特定的DOM节点。...
根据提供的文件信息，我们可以推断出这是一本关于JavaScript DOM编程技术的书籍——《JavaScript DOM编程艺术（第2版）》。尽管实际书籍内容并未给出，但从标题、描述及部分链接信息来看，这本书主要涉及JavaScript...
听说你在找react-dom.development.js这个文件，在带走它前记得收藏加点赞、听说你在找react-dom.development.js这个文件，在带走它前记得收藏加点赞、听说你在找react-dom.development.js这个文件，在带走它前记得...
《DOM Scripting: Web Design with JavaScript and the Document Object Model》是由Jeremy Keith撰写的一本关于JavaScript和DOM编程的经典著作。这本书深入浅出地介绍了如何利用JavaScript动态操控网页内容，提升...
标题 "returning-DOM-elements-javascript-源码.rar" 暗示了这是一个关于使用JavaScript操作和检索DOM元素的源代码集合。DOM（Document Object Model）是HTML和XML文档的结构化表示，允许通过编程方式访问和修改文档...