`
mhbjava
  • 浏览: 95947 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

DOM创建table

阅读更多

Dom笔记:

1。document.body可以直接定位到body 节点,如:onclick="reverseNode(document.body)"

var c = node.removeChild(kids[i]) //删除子节点,保存在c中 。要删除的东西有返回值

2。var kid1 = table1.firstChild.firstChild.firstChild//定位到<td>节点
   var kid2 = table2.firstChild.firstChild.firstChild//定位到<td>节点
   var repKid = kid2.firstChild //定位到表格二<td>内容的TextNode节点
   kid1.replaceChild(repKid,kid1.firstChild);//用表格二的单元格内容替换表格一的单元格内容,表格二变成没有单元格内容

   //下面注释如果开发,将出现object error ,因为表格二已经被改变,它已经没有子节点了 (注意:没有子节点的就一定不能调用firstChild)

   //kid2.replaceChild(kid1.firstChild,kid2.firstChild);


3.<tbody>隐含存在<table></table>  firstChild为<tbody>

4. var node = document.getElementByTagName("table")[0];
   node.removeChild(node.childNodes[0]);//删除全部单元格
   var header = node.createTHead()//新建表格行头
   var headerrow = header.insertRow(0);//插入一个单元行
   var cell = headerrow.insertCell(0)//插入一个单元格


5.parNode.insertBefore(tbody,parNode.firstChild)将节点tbody插入到节点顶部
  <td>内部的是<TextNode>节点

 




分享到:
评论

相关推荐

    js动态创建table点击按钮dom table tr添加操作

    js动态创建table点击按钮dom table tr添加操作

    js动态创建Table

    利用纯javascript来实现的动态表格!!!超级实用知识点大概包括,jq、基本dom的获取、创建节点、innerHTML添加内容、js给标签创建属性、动态在表格中添加按钮。

    使用JavaScript和DOM动态创建表格

    使用JavaScript和DOM动态创建表格

    038HTML-DOM对象.doc

    Table 对象代表一个 HTML 表格,在 HTML 文档中,&lt;table&gt; 标签每出现一次,一个 Table 对象就会被创建。Table 对象的常用属性有: * cells:返回包含表格中所有单元格的一个数组 * rows:返回包含表格中所有行的一...

    JavaScript DOM操作表格及样式

    &lt;table&gt;标签是HTML中结构最为复杂的一个,我们可以通过DOM来创建生成它,或者HTMLDOM来操作它; // 使用DOM来创建表格; var table = document.createElement('table'); table.border = 1; table.width = 300; var ...

    JavaScript与DOM组合动态创建表格实例

    它使用DOM 1的方法由JavaScript动态创建一个HTML表格。它创建一个由四个包含文本内容的单元格组成的小表格。单元格的文字内容是:“单元格是第y行第x列”,表示单元格在表格中的行数和列数。 代码如下:&lt;ht

    Tabletree4j Version 2

    动态dom对象创建表格树  5.完美支持json格式数据,支持xml(需转换)  6.支持ajax加载节点  7.事件驱动  8.可以动态根据列内容排序  9.简化函数参数,利用{} object输入参数,风格类似Extjs  10.树状结构可以选择...

    火狐下table中创建form导致两个table之间出现空白

    在&lt;FORM&gt;中加CSS &lt;table&gt; ……. &lt;/table&gt; &lt;... &lt;/table&gt;会出现问题 在网上看到过另一种说法,在table中创建form表单是不符合DOM标准的,会导致post失效,以及js数据传输失效。 特此铭记!@

    emel:使用 Emmet 创建 DOM 元素

    使用 Emmet 创建 DOM 元素 安装 npm install emel 用法 您可以使用任何。 选项: : boolean : boolean : mixed const emel = require ( "emel" ) ; const emmetString = "table&gt;thead&gt;tr&gt;th{col1}+th{col2}^...

    vue动态生成dom并且自动绑定事件

    用jquery的时候你会发现,页面渲染后动态生成的dom,在生成之前的代码是没办法取到相应对象的,必须重新获取.但是vue基于数据绑定的特性让它能生成的时候直接绑定数据。 html: &lt;table v-for=table&gt; &lt;...

    react-table-filter:在表列项目上创建过滤器(如Excel)

    React表过滤器模块为表格创建Excel,例如“列过滤器”。 过滤器列表包含每一列中存在的所有唯一项。 例如,请参见下图。演示版安装您需要在项目中具有react和react-dom作为依赖项。 安装,运行$ npm install react-...

    关于layui 实现点击按钮添加一行(方法渲染创建的table)

    方案1、table 是用转换静态表格的方式创建的,写一个button,每次点击按钮,就添加一个&lt;tr&gt; 标签; 方案2、table 是用方法渲染的方式创建的,写一个button,每次点击按钮,加载数据时添加一个Object; 之前我试过用...

    JsDom 编程小结

    1.浏览器兼容问题: 浏览器兼容性的例子:ie6,ie7对table.appendChild(“tr”)的支持和IE8不一样,用insertRow、insertCell来代替或者为表格添加tbody,然后向tbody中添加tr。FF(FireFox)不支持InnerText,用...

    csv2table:从CSV生成HTML表的组件

    csv2table ...用法: 类型1:使用已创建的表 var genTable = new csv2table({ csvString: "csvString", domElem: "tableID" }); genTable.run();... 此方法会将一个表元素添加到网页的现有DOM树中。

    使用Javascript和DOM Interfaces来处理HTML

    Sample code – Traversing an HTML Table with JavaScript and DOM Interfaces [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]Note the order in which we created the elements and the text ...

    TableOfContents:一个灵活的插件,可根据网页的 HTML 标记生成目录

    根据目录的容器DOM元素自动确定列表类型 支持嵌套的有序和无序列表,以及链接的直接列表 为每个标题自动创建类似 slug 的锚点(在还没有 id 的标题上) 支持比例间距格式选项以创建表示实际内容量的可视化目录 是...

    jQuery实现表格元素动态创建功能

    Jquery实现表格元素的动态创建,本质是通过构造一个Dom Node节点,并且拼接到表格的Dom树上的子叶位置。 HTML正文: 用户:&lt;input type=text id=user/&gt; 邮箱:&lt;input type=text id=mail/&gt; 手机:&lt;...

    VanillaJS-Class-DOM:用 VanillaJS 完成的书单

    VanillaJS-Class-DOM 文档对象模型是网页的接口,在页面加载时由浏览器创建的 HTML 文档表示。 使用 JavaScript,我们可以修改网络的结构、样式和内容。 它基于面向对象编程 ,所以这就是我使用在这个 repo 中构建...

    树形表格菜单 动态添加节点/动态删除节点/动态移动节点

    4.动态dom对象创建表格树 5.完美支持json格式数据,支持xml(需转换) 6.支持ajax加载节点 7.事件驱动 8.可以动态根据列内容排序 9.简化函数参数,利用{} object输入参数,风格类似Extjs 10.树状结构可以选择出现在某一列...

Global site tag (gtag.js) - Google Analytics