通过黑马课程的学习,在这里分享一个js Dom中节点操作的小练习

需求:使用js创建一个4*3的表格table.

onload = function(){
function c(tagName){
return document.createElement(tagName);
}
var table = c('table');
var tbody = c('tbody');
table.appendChild(tbody);
for(var i = 0;i<4;i++){
var tr = c('tr');
for(var j = 0;j<3;j++){
var td = c('td');
//在td中放置文本
var txt = document.createTextNode('');
td.appendChild(txt);
tr.appendChild(td);
td.width = 200;
td.height = 50;
}
tbody.appendChild(tr);
}
table.setAttribute('border','1');
document.body.appendChild(table);
};

JS Dom节点操作demo!的更多相关文章

  1. 04-老马jQuery教程-DOM节点操作及位置和大小

    1. jQuery创建DOM标签 1.1 DOM动态创建标签的方法 DOM时代我们通过document的createElement方法动态创建标签.创建标签后,动态的给他添加属性.例如代码: // 动 ...

  2. 深入理解DOM节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]移除节点[4]替换节点[5]复制节点 前面的话 一般地,提起操作会想到“增删改查”这四个字,而DOM节点操作也类似地对应于此,接下来将详细介绍DOM的节 ...

  3. (转载)html dom节点操作(获取/修改/添加或删除)

    DOM 是关于如何获取.修改.添加或删除 HTML 元素的标准,下面为大家介绍下html dom节点操作,感兴趣的朋友可以参考下   HTML DOM 是关于如何获取.修改.添加或删除 HTML 元素 ...

  4. 第一百六十七节,jQuery,DOM 节点操作,DOM 节点模型操作

    jQuery,DOM 节点操作,DOM 节点模型操作 学习要点: 1.创建节点 2.插入节点 3.包裹节点 4.节点操作 DOM 中有一个非常重要的功能,就是节点模型,也就是 DOM 中的“M”.页面 ...

  5. 前端JavaScript之DOM节点操作

    1.HTML DOM是啥 Document Object Model:定义了访问和操作HTML文档的标准方法,把HTML文档呈现为带有元素,属性和文本的树状结构 2.解析过程 HTML加载完毕,渲染引 ...

  6. Dom节点操作总结

    Dom   一:Dom的概念 Dom的简介:  全称为 document object model  文档对象模型,是操作文档的一整套方法 - 文档 - html,document时一个对象,是dom ...

  7. 原生JS的DOM节点操作

    DOM(Document Object Model/文档对象模型)是针对HTML和XML文档的一个API.DOM节点树:在文档中出现的空格.回车.标签.注释.文本.doctype.标签等都属于DOM节 ...

  8. javasript 的DOM 节点操作:创建,插入,删除,复制以及查找节点

    DOM 含义: DOM 是文档对象模型(Document Object Model) 是一种基于浏览器编程的一套API 接口,我W3C 出台推荐的标准.其赋予了JS 操作节点的能力,当网页被加载时,浏 ...

  9. JavaScript DOM–节点操作

    节点 节点至少拥有nodeType(节点类型).nodeName(节点名称)和nodeValue(节点值)这三个基本属性. 元素节点 nodeType  为1 属性节点 nodeType  为2 文本 ...

随机推荐

  1. js相关小实例——div实现下拉菜单

    代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  2. 3018: [Usaco2012 Nov]Distant Pastures

    3018: [Usaco2012 Nov]Distant Pastures Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 43  Solved: 20[ ...

  3. 算法模板——sap网络最大流 2(非递归+邻接表)

    实现功能:同最大流 1 这里面主要是把前面的邻接矩阵改成了邻接表,相比之下速度大大提高——本人实测,当M=1000000 N=10000 时,暂且不考虑邻接矩阵会不会MLE,新的程序速度快了很多倍(我 ...

  4. RabbitMQ-从基础到实战(1)— Hello RabbitMQ

    转载请注明出处 1.简介 本篇博文介绍了在windows平台下安装RabbitMQ Server端,并用JAVA代码实现收发消息 2.安装RabbitMQ RabbitMQ是用Erlang开发的,所以 ...

  5. Django通用视图执行过程

    使用通用视图后,Django请求处理过程(以ListView为例):在我们自定义的视图中: class IndexView(ListView): template_name = 'blog/index ...

  6. 笔记本win10关机异常解决

    自从使用了win10 以后,小编已经情不自禁的爱上了她——迄今为止最NB的windows系统 但令人头疼的问题也随之而来,前几天购置了一款三星的SSD固态硬盘,马上就装了win10,某天晚上关机以后发 ...

  7. CSS 去掉点li 的点

    转:http://blog.sina.com.cn/s/blog_63b13c300100jyek.html 方法一: <ul> <li style="list-style ...

  8. mui和zepto的tap事件

    zepto.js和mui一起使用的时候,tap事件会发生两次,这时只要不引用zepto.js的touch.js就可以了,只用mui的tap事件转自[B5教程网]:http://www.bcty365. ...

  9. 富文本,NSAttributedString,当需要改变的内容有相同的时候的解决方法

    在开发的过程中可能会遇到富文本展示,例如:一行文本,前面是题后面是答案,题和答案用不同的颜色字体,但是答案的内容在题总也有,这时候用平常的方法就会展示错误,因为把题中的内容改变了颜色二实际答案却没有改 ...

  10. vs打开项目出错:未找到导入的项目“C:\Program Files (x86)\MSBuild\Microsoft.Cpp\v4.0\BuildCustomizations\CUDA 5.0.props”的解决办法

    有时候由于CUDA升级或者下载的源码原创建项目的CUDA版本与自己的不同,在打开项目的时候发现加载不上,提示:未找到导入的项目“C:\Program Files (x86)\MSBuild\Micro ...