【html】parentNode的应用

parentNode的应用

删除列表中的选项（不删除dom）

window.onload=function(){// 假删除var aNodes = document.querySelectorAll('.list > li > a');for(var i=0;i<aNodes.length;i++){aNodes[i].onclick = function(){aNodes[i].parentNode.style.display='none';}}
}

执行以上代码进行删除时，会报错。原因是这里的aNodes[i]指向的是第六个a节点，而第六个a节点不存在。

将aNodes改为this，这样每次绑定的事件是谁，那么this就指向谁。这样即可实现。（也可用闭包来实现）

window.onload=function(){// 假删除var aNodes = document.querySelectorAll('.list > li > a');for(var i=0;i<aNodes.length;i++){aNodes[i].onclick = function(){this.parentNode.style.display='none';}}
}

这样即可实现假删除，且dom结构没有改变，数据没有丢失。（数据很重要！！！）

【html】parentNode的应用相关推荐

html内通过parentNode来得到上级对象，与此对应的，还有childNodes[x]得到下级对象...
但是对于表格要注意,在<table>和<tr>之间还有一个<tbody>,即使你在构建<table>时没有使用这个<tbody> <t ...
this.parentNode.nextSibling 对div里的换行敏感
 <div class="car_list"> <ul> <p><stron ...
javascript中parentNode,childNodes,children的应用详解
"parentNode" 常用来获取某个元素的父节点. 把 parentNodes 理解为容器, 在容器中有个子节点例: <div id="parent" ...
WordPress中J.parentNode’为空或不是对象的解决方法
最近摆弄WP,感受到其系统的灵活性和插件的功能强大,客户要求能够在线播放本地服务器上的flv格式视频,经过比较后选择了插件 flash-video-player,用IE6打开首页时出现:j.paren ...
parentNode，parentElement,offsetParent
offsetParent直接的将是影响元素位置的上级element,而parentElement与位置显示无关时dom中的上级element. 例如:<BODY><div style ...
DOM之parentNode与offsetParent
DOM中有两个属性parentNode和offsetParent,想必区别大家都是知道的,可用法上还是有一些需要注意的地方,尤其是后者,想知道吗?继续往下看咯. parentNode指的是父节点,el ...
parentNode和offsetParent的使用
元素.parentNode:只读属性,指当前元素的父级节点 offsetParent:只读属性离当前元素最近的一个有定位属性的父节点如果没有定位父级,默认是body,有兼容性问题. 先上pare ...
offsetParent与parentElement ,parentNode,parentElement,childNodes和children
offsetParent直接的将是影响元素位置的上级element,而parentElement与位置显示无关时dom中的上级element. 例如: <BODY> <div ...
parentElement\parentNode.parentNode.childNodes用法例子
offsetParent,parentNode,parentElement 区别 offsetParent 指与位置有关的上级元素 parentNode 指与位置无关的上级元素 parent ...
javascript 中 parentNode，childNodes、children 应用
"parentNode" 常用来获取某个元素的父节点. 把 parentNodes 理解为容器, 在容器中有个子节点例: <div id="parent ...

【html】parentNode的应用

parentNode的应用

【html】parentNode的应用相关推荐

最新文章

热门文章