DOMNodeInserted,DOMNodeRemoved 和监听内容变化插件
元素的增加 删除 及事件监听
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div>
点击添加li
</div>
<ul>
<li>kkkk</li>
</ul>
<button>
点击删除节点
</button>
</body>
<script>
var ul = document.getElementsByTagName('ul')[0]
document.getElementsByTagName('div')[0].onclick = function () {//添加元素
var li=document.createElement('li');
var t=document.createTextNode('666')
li.appendChild(t) ul.appendChild(li)
}
document.getElementsByTagName('button')[0].onclick = function () {//删除元素
ul.removeChild(ul.lastElementChild) } ul.addEventListener('DOMNodeInserted',function () {
console.log(ul.childElementCount) })
ul.addEventListener('DOMNodeRemoved',function () {
console.log(ul.childElementCount) }) </script>
</html>
DOMNodeInserted,DOMNodeRemoved 和监听内容变化插件的更多相关文章
- edittext 监听内容变化
给EditText追加ChangedListener可以监听EditText内容变化的监听 如图是效果图 类似于过滤的一种实现 1 布局也就是一个EditText,当EditText内容发生变化时 ...
- 监听内容变化 TextWatcher @功能
监听多个TextView的内容变化 使用示例 TextWatcherUtils.addTextChangedListener(isAllNotEmpty -> btnLogin.setEnabl ...
- node.js监听文件变化
前言 随着前端技术的飞速发展,前端开发也从原始的刀耕火种,向着工程化效率化的方向发展.在各种开发框架之外,打包编译等技术也是层出不穷,开发体验也是越来越好.例如HMR,让我们的更新可以即时可见,告别了 ...
- 009——VUE中watch监听属性变化实现类百度搜索栏功能
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- iOS开发之--为UITextField监听数值变化的三种方法
项目中有个验证码输入直接验证跳转页面,用的RAC来监听textfield的输入值,如下: @weakify(self); [self.codeView.textField.rac_textSignal ...
- Angular.js中使用$watch监听模型变化
$watch简单使用 $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. $watch(watchExpression, listener, objectEqua ...
- $scope.$watch()——监听数据变化
$scope.$watch(watchFn, watchAction, [deepWatch]):监听数据变化,三个参数 --watchFn:监听的对象,一个带有Angular 表达式或者函数的字符串 ...
- 如何使用NodeJs来监听文件变化
1.前言 在我们调试修改代码的时候,每修改一次代码,哪怕只是很小的修改,我们都需要手动重新build文件,然后再运行代码,看修改的效果,这样的效率特别低,对于开发者来说简直不能忍. 2.构建自动编译工 ...
- android动态注册监听网络变化异常
在使用广播接收器监听网络变化的时候,在AndroidManifest.xml中加入<user-permission android:name="android.permission.A ...
随机推荐
- poj3274 找平衡数列(哈希加一点数学思维)
题目传送门 题目大意:有n只牛,每只牛有k个属性,接下来n个数字,每个数字的二进制位上的1和0分别表示某种属性的有或者无,然后一个特殊数列就是,一个区间内所有牛的各种属性的总和相等(有e种1属性 e ...
- linux / OS 杀死进程
1,查询端口 sudo netstat -apn | grep 端口号 2,杀死进程kill -9 应用程序进程id
- linux 数据库管理
1.安装数据库: yum install mariadb.serversystemctl staus mariadbsystemctl start mariadbsystemctl enable ma ...
- Ubuntu14.10:Install Apache,PHP,Mysql以及扩展库
step 1: Apache sudo apt-get install apache2 After have apache2 installed, go to localhost by browser ...
- Photoshop入门教程(四):混合模式
学习心得:混合模式在Photoshop常容易被忽视,最大原因就是它所处的位置比较隐蔽,在图层面板左上部的角落里.使用混合模式,决定图像中上图层像素如何与图像中的下层像素进行混合,使图层的叠加更加炫酷. ...
- requirej入门(一)
随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元测试等等一系列复杂的需求 ...
- 搭建并行开发环境MPICH2
平台信息 Description: CentOS Linux release 7.6.1810 (Core) 注意事项 安装BLAS之前需要: 安装 GCC/GFortran 环境 安装步骤 下载 m ...
- HTML_DOM学习
HTML DOM 树 通过ID/类名/标号可以定位HTML元素,然后可用JS改变这些元素的样式内容,并对DOM事件作出反应 对HTML事件的响应: onmousedown 和onmouseup/onc ...
- Flag-2019上半年
1.坚持做博客记录,把日常学习到的技能以日记的形势进行呈现,每周进行总结: 2.2月底完成吴老师的机器学习视频课程: 3.6月底完成吴老师的深度学习视频课程: 相信自己,可以的,半年后见!
- [转]Passing data between pages in JQuery Mobile mobile.changePage
本文转自:http://ramkulkarni.com/blog/passing-data-between-pages-in-jquery-mobile/ I am working on a JQue ...