原生 ES6极简删删除节点 箭头函数,正则,call
2017-11-03 17:23
274 查看
// html结构
需求:把与Web开发技术不相关的节点删掉
<ul id="t-list">
<li>JavaScript</li>
<li>Swift</li>
<li>HTML</li>
<li>ANSI C</li>
<li>CSS</li>
<li>DirectX</li>
</ul>
<script>
'use strict';
var oLi = document.querySelectorAll('#t-list>li');
var reg = /(javascript)|(html)|(css)/gi;
[].map.call(oLi, x =>x.innerText.search(reg) === -1 ? x.parentElement.removeChild(x) : x);
</script>
删除子节点,另外一种方法是用常规循环:
var oUL = document.getElementById('t-list');
while (oUL.children.length > 0) {
oUL.removeChild(oUL.children[oUL.children.length - 1]);
}
需求:把与Web开发技术不相关的节点删掉
<ul id="t-list">
<li>JavaScript</li>
<li>Swift</li>
<li>HTML</li>
<li>ANSI C</li>
<li>CSS</li>
<li>DirectX</li>
</ul>
<script>
'use strict';
var oLi = document.querySelectorAll('#t-list>li');
var reg = /(javascript)|(html)|(css)/gi;
[].map.call(oLi, x =>x.innerText.search(reg) === -1 ? x.parentElement.removeChild(x) : x);
</script>
删除子节点,另外一种方法是用常规循环:
var oUL = document.getElementById('t-list');
while (oUL.children.length > 0) {
oUL.removeChild(oUL.children[oUL.children.length - 1]);
}
相关文章推荐
- jQuery的index()原生js实现以及删除空白文本节点函数
- javascript this 和 es6 箭头函数this 的理解以及call()、apply()、bind()的用法
- es6扩展运算符,rest运算符,箭头函数,
- 深入浅出ES6的箭头函数
- es6中箭头函数学习的一个记录
- React native 之ES6语法(promise,箭头函数)
- 深入理解ES6箭头函数中的this
- 正则表达式的运用—— 一键删除Loadrunner录制脚本时生成的无关函数
- javaES6箭头函数的全新特性
- es6中箭头函数学习的一个记录
- 删除加载js文件的scrip节点后,该js文件里面的函数还可以用吗?
- 利用android提高的的insert,query,update,deleteAPI与execSql,rawQuery函数执行原生的插入,查询,更新,删除语
- [js高手之路] es6系列教程 - 箭头函数详解
- 删除DOM节点的函数
- ES6学习——箭头函数
- ES6箭头函数和它的作用域
- ES6中箭头函数的定义与调用方式详解
- ES6的箭头函数介绍
- ES6学习总结之函数变化(函数默认参数,扩展运算符,箭头函数)