nodeValue、firstChild和lastChild属性

nodeValue属性
如果想改变一个文本节点的值，那就使用DOM提供的nodeValue属性，他用来得到（和设置）一个节点的值：
node.nodeValue
但是有个细节必须注意：在用nodeValue属性获取description对象的值时，得到的并不是包含在这个段落里的文本。
可以用下面这条alert语句来验证这一点：
alert(description.nodeValue);
html代码如下
<html>
<body>
<p id = "description">ssssss</p>
</body>
</html>
这个调用将返回一个null值。<p>元素本身的nodeValue属性是一个空值，而你真正需要的是<p>元素所包含的文本的值。
包含在<p>元素里的文本是另一种节点，它是<p>元素的第一个子节点。因此，你想要得到的其实是它的第一个子节点的nodeValue属性值。
下面这个条alert语句可以显示你想要的内容：
alert(description.childNodes[0].nodeValue);
这个值来自childNodes数组的第一个（下标是0）元素。

firstChild和lastChild属性
数组元素childNodes[0]有个更直观易读的同义词。无论何时何地，只要需要访问childNodes数组的第一个元素，都可以把它写成firstChild:
node.firstChild
这种写法与下面的写法完全等价：
node.childNodes[0]
DOM还提供了一个与之对应的lastChild属性：
node.lastChild
这代表着childNodes数组的最后一个元素。

转载于:https://www.cnblogs.com/zhengfuheidao/p/6203161.html

nodeValue、firstChild和lastChild属性相关推荐

JS--JavaScript访问节点（childNodes、parentNode、firstChild、lastChild、nextSibling、previousSibling）
访问节点通过节点之间的树形关系,可以定位文档中的每个节点.DOM为Node类型定义如下属性,以方便JavaScript对文档树中每个节点进行遍历. ownerDocument:返回当前节点的根元素( ...
JavaScript--DOM-- firstChild 和lastChild 属性
4.4.6 firstChild 和lastChild 属性数组元素childNodes[0] 有个更直观易读的同义词.无论何时何地, 只要需要访问childNodes 数组的第一个元素,都可以把它 ...
解决css样式中first-child和last-child不生效的问题
前端项目需要使用v-for指令来渲染一个问题回复列表,列表的第一和最后需要显示不同的样式,便使用到了first-child和last-child这两个CSS属性,在编码后发现 last-child 和 ...
first-child、last-child、nth-child( )失效问题
最经遇到一个first-child.last-child.nth-child()失效的问题,我相信还有很多人都会遇到,下面我就分2类来简单的说明下 ①first-child和last-child失效 ...
firstChild、lastChild 和 firstElementChild、lastElementChild 的区别
文章目录一.前言二.Node.prototype.firstChild,Node.prototype.lastChild 三.ParentNode.firstElementChild.Parent ...
jquery子元素过滤选择器:nth-child、:first-child、:last-child、:only-child
全栈工程师开发手册 (作者:栾鹏) jquery系列教程1-选择器全解 jquery子元素过滤选择器 jquery子元素过滤选择器,包括:nth-child.:first-child.:last-ch ...
[CSS] css使用first-child 和last-child 实现三条杠效果
first-child 和last-child是伪类选择器,选择第一个和选择最后一个子元素现在实现下面的效果 <div class="menuico"><spa ...
css3 - 选择器first-child、last-child、nth-child、nth-last-child、nth-of-type
https://blog.csdn.net/erdouzhang/article/details/70842177 最近系统项目,遇到较多表格和 div 需要根据写样式的 1.first-chil ...
CSS中的:nth-child，:first-child，:last-child
:nth-child(n) 选择器匹配父元素中的第 n 个子元素,元素类型没有限制实现代码: <template><div class="jo">< ...

nodeValue、firstChild和lastChild属性

nodeValue、firstChild和lastChild属性相关推荐

最新文章

热门文章