`

javascript 通过children 获取表格内部的标签内容

阅读更多

通过children[n]、childNodes[n]来获取表格内的标签值

 

 

<div id="tupian"><table cellpadding="0" cellspacing="1" border="0" width="100%" id="table1">
<tr operTab(this)>
<td>

&nbsp;

  <label text="hello yang!" />

  <input type="hidden" value="123" />

</td>
</tr>
</table>

 

function operTab(obj)

{
           
         
           var id = obj.cells(0).innerText; //获取td内的内容

 

 

            //获取隐藏域内的value    children和childNodes区别:children只取HTML,
            //childNodes取HTML和包含文本innerHTML;         
           var ids = obj.cells(0).children[1].value;

           // 跟上面children功能相同,获取隐藏域标签内的值

           var id1 = obj.cells(0).childNodes[3]。value;  

            var nodename= obj.cells(0).childNodes[3].nodeName;              
            alert(id);
            alert(ids);

            alert(id1);

}

 

Element 对象的属性

属性 描述 IE F O W3C
attributes 返回元素的属性的 NamedNodeMap 5 1 9 Yes
baseURI 返回元素的绝对基准 URI No 1 No Yes
childNodes 返回元素的子节点的 NodeList 5 1 9 Yes
firstChild 返回元素的首个子节点 5 1 9 Yes
lastChild 返回元素的最后一个子节点 5 1 9 Yes
localName 返回元素名称的本地部分 No 1 9 Yes
namespaceURI 返回元素的命名空间 URI No 1 9 Yes
nextSibling 返回元素之后紧跟的节点 5 1 9 Yes
nodeName 返回节点的名称,依据其类型。 5 1 9 Yes
nodeType 返回节点的类型 5 1 9 Yes
ownerDocument 返回元素所属的根元素 (document 对象) 5 1 9 Yes
parentNode 返回元素的父节点 5 1 9 Yes
prefix 设置或返回元素的命名空间前缀 No 1 9 Yes
previousSibling 返回元素之前紧随的节点 5 1 9 Yes
schemaTypeInfo 返回与元素相关联的类型信息     No Yes
tagName 返回元素的名称 5 1 9 Yes
textContent 设置或返回元素及其后代的文本内容 No 1 No Yes
text 返回节点及其后代的文本 (IE-only) 5 No No No
xml 返回节点及其后代的 XML (IE-only) 5 No No No

Element 对象的方法

方法 描述 IE F O W3C
appendChild() 向节点的子节点列表末尾添加新的子节点。 5 1 9 Yes
cloneNode() 克隆节点。 5 1 9 Yes
compareDocumentPosition() 比较两节点的文档位置。 No 1 No Yes
dispatchEvent() 给节点分派一个合成事件。 No 1 9 Yes
getAttribute() 返回属性的值。 5 1 9 Yes
getAttributeNS() 返回属性的值。 No 1 9 Yes
getAttributeNode() 以 Attribute 对象返回属性节点。 5 1 9 Yes
getAttributeNodeNS() 以 Attribute 对象返回属性节点。 No   9 Yes
getElementsByTagName() 找到具有指定标签名的子孙元素。 5 1 9 Yes
getElementsByTagNameNS() 找到具有指定标签名和命名空间的元素。 No 1 9 Yes
getFeature(feature,version) 返回 DOM 对象,此对象可执行拥有指定特性和版本的专门的 API。     No Yes
getUserData(key) 返回关联节点上键的对象。此对象必须首先通过使用相同的键来调用 setUserData 来设置到此节点。     No Yes
hasAttribute() 返回元素是否拥有指定的属性。 5 1 9 Yes
hasAttributeNS() 返回元素是否拥有指定的属性。 No 1 9 Yes
hasAttributes() 返回元素是否拥有属性。 5 1 9 Yes
hasChildNodes() 返回元素是否拥有子节点。 5 1 9 Yes
insertBefore() 在已有的子节点之前插入一个新的子节点。 5 1 9 Yes
isDefaultNamespace(URI) 返回指定的命名空间 URI 是否为默认。     No Yes
isEqualNode() 检查两节点是否相等。 No No No Yes
isSameNode() 检查两节点是否为同一节点。 No 1 No Yes
isSupported(feature,version) 返回指定的特性是否在此元素上得到支持。     9 Yes
lookupNamespaceURI() 返回匹配指定前缀的命名空间 URI。 No 1 No Yes
lookupPrefix() 返回匹配指定的命名空间 URI 的前缀。 No 1 No Yes
normalize()   5 1 9 Yes
removeAttribute() 删除指定的属性。 5 1 9 Yes
removeAttributeNS() 删除指定的属性。 No 1 9 Yes
removeAttributeNode() 删除指定的属性节点。 5 1 9 Yes
removeChild() 删除子节点。 5 1 9 Yes
replaceChild() 替换子节点。 5 1 9 Yes
setUserData(key,data,handler) 把对象关联到元素上的键。     No Yes
setAttribute() 添加新属性。 5 1 9 Yes
setAttributeNS() 添加新属性。   1 9 Yes
setAttributeNode() 添加新的属性节点。 5 1 9 Yes
setAttributeNodeNS(attrnode) 添加新的属性节点。     9 Yes
setIdAttribute(name,isId) 如果 Attribute 对象 isId 属性为 true,那么此方法会把指定的属性声明为一个用户确定 ID 的属性(user-determined ID attribute)。     No Yes
setIdAttributeNS(uri,name,isId) 如果 Attribute 对象 isId 属性为 true,那么此方法会把指定的属性声明为一个用户确定 ID 的属性(user-determined ID attribute)(带有命名空间)。     No Yes
setIdAttributeNode(idAttr,isId) 如果 Attribute 对象 isId 属性为 true,那么此方法会把指定的属性声明为一个用户确定 ID 的属性(user-determined ID attribute)。     No Yes

 

引用:http://www.w3school.com.cn/xmldom/dom_element.asp

 

 

 

分享到:
评论

相关推荐

    用Jquery获取table中td的值

    在JavaScript的世界里,jQuery是一个非常流行的库,它简化了DOM...总的来说,掌握jQuery获取表格数据的方法是前端开发中的一项基本技能,这不仅有助于提高代码的可读性和效率,还能使你在处理DOM操作时更加游刃有余。

    JQuery操作表格.rar

    比如获取所有行(`tr`),可以使用`find()`或`children()`方法: ```javascript var rows = table.find("tr"); ``` 若要对每一行执行操作,可以使用`.each()`循环: ```javascript rows.each(function(index, row) { ...

    jQuery实现获取table表格第一列值的方法

    要获取表格的第一列值,我们可以利用jQuery的选择器和遍历功能。以下是实现这一功能的关键代码段: ```javascript $(function() { $("#Button1").click(function() { var cols = ""; $("#tb tr").each(function...

    一些方案的实现方法js笔记

    在JavaScript中,可以使用`document.getElementById()`、`document.querySelector()`或`document.querySelectorAll()`来获取表格元素,如`&lt;table&gt;`、`&lt;tr&gt;`、`&lt;td&gt;`等。对于`&lt;select&gt;`标签,可以获取其选项通过`...

    jquery 初学这比较适合下载

    `.append()`, `.prepend()`则可以向元素内部添加内容。 **五、CSS操作** jQuery允许快速更改元素的样式,如`.css()`, `.addClass()`, `.removeClass()`, `.toggleClass()`等。 ```javascript $("#myDiv").css(...

    JQuery学习笔记

    获取表格行** - `$("tbody tr")`选择`&lt;tbody&gt;`内的所有`&lt;tr&gt;`元素。 **6. 偶数行选择** - `$("tbody tr:even")`选择`&lt;tbody&gt;`内的索引为偶数的`&lt;tr&gt;`元素。 **7. 设置或获取CSS属性** - `css()`方法可以用来...

    基于Jquery的前台按表头排序

    在监听器内部,我们可以通过遍历表格数据,根据点击的列头进行排序,并更新表格内容。以下是一个简单的示例: ```javascript $(document).ready(function() { $('th').click(function() { var th = $(this); var ...

    JQapichankao

    3. **DOM操作(DOM Manipulation)**: jQuery提供了丰富的DOM操作方法,如`append()`(在元素内部添加内容),`prepend()`(在元素内部预置内容),`remove()`(删除元素),以及`clone()`(复制元素)等。...

    jquery遍历table的tr获取td的值实现方法

    通过上述知识点的介绍,我们可以看到如何利用jQuery库来实现对HTML表格中数据的遍历,并获取单元格中的值,同时也了解了相关的HTML结构和一些常见的JavaScript交互方式。这些内容对于进行Web开发的人员来说都是基本...

    jQuery API文档

    jQuery提供了一系列方法来操作DOM,如`append()`用于在元素内部追加内容,`prepend()`在元素内部前部添加内容,`remove()`删除匹配的元素,`html()`和`text()`分别用于设置或获取元素的HTML内容和文本内容。...

    50个经典jquery实例

    如`append()`用于在元素内部添加内容,`prepend()`在元素内部开头插入内容,`remove()`移除元素,`html()`、`text()`和`val()`用于设置或获取元素内容。 3. **事件处理**:jQuery简化了事件绑定。`click()`, `...

    点击按钮文字变成input框,点击保存变成文字的实现代码

    - 通过`&lt;style&gt;`标签定义样式,该代码片段内定义了表格的文本对齐、字体大小、表格样式以及文本框(input)的样式。 - `.text-right`类定义了右侧单元格的样式,比如文本右对齐和内边距。 - `.text`类定义了文本框...

    使用delegate方法为一个tr标签加一个链接

    在这个回调函数内部,首先获取了行内的相关元素,如第一个子元素(通常是包含学生ID的`&lt;td&gt;`)、第8个子元素(可能是包含修改按钮的`&lt;td&gt;`),以及最后一个子元素(可能包含删除按钮的`&lt;td&gt;`)。这可以通过`....

    jquery特效详解

    例如,`.append()`、`.prepend()`用于在元素内部添加内容,`.after()`、`.before()`用于在元素前后插入内容,`.clone()`用于复制元素,`.remove()`用于删除元素,`.detach()`用于移除但不销毁元素,`.empty()`用于...

    15个jquery常用方法、小技巧分享

    例如,通过jQuery获取表格中单元格(td)的行索引和列索引是开发表格相关功能时的常见需求。判断是否是回车按键的按下则是表单验证和快捷操作中经常需要用到的功能。全选和反选则常见于多选框操作中,这些功能在实现...

    jquery1.7手册

    - `append()`与`prepend()`:分别在元素内部的末尾和开头添加内容。 - `appendTo()`与`prependTo()`:相反的操作,将元素添加到其他元素的末尾或开头。 - `html()`, `text()`, `val()`:用于获取或设置元素的HTML...

    js使用小技巧

    获取选中内容 document.selection.createRange().duplicate().text 自动完成功能 打开该功能 关闭该功能 窗口最大化 (window.screen.width - 4,window.screen.height-50);window.moveTo(-4,-4)"&gt; 无关闭...

    jQuery的选择器中的通配符使用介绍

    - `children()` 方法:`jqueryObj.children("input").length`将返回`jqueryObj`下一级中`&lt;input&gt;`标签的数量。 - `&gt;` 子选择器:`$(".main &gt; a")`会选择所有属于`.main`类的直接子元素`&lt;a&gt;`标签。 4. **相邻元素...

    freemarker总结

    JAVA模版引擎Freemarker常用标签(一) 1. if指令 这是一个典型的分支控制指令,该指令的作用完全类似于Java语言中的if,if指令的语法格式如下: &lt;#if condition&gt;... &lt;#elseif condition&gt;... &lt;#elseif condition&gt;......

Global site tag (gtag.js) - Google Analytics