九门宁生

导航

2019年8月26日 #

事件冒泡

摘要: 事件冒泡的作用: 阅读全文

posted @ 2019-08-26 17:18 九门宁生 阅读(147) 评论(0) 推荐(0) 编辑

移除事件的兼容性处理

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="按钮" id="btn"> <script src="common.js"></script& 阅读全文

posted @ 2019-08-26 17:01 九门宁生 阅读(229) 评论(0) 推荐(0) 编辑

移除事件

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="按钮" id="btn"> <script> var btn = document.getElementById( 阅读全文

posted @ 2019-08-26 16:59 九门宁生 阅读(154) 评论(0) 推荐(0) 编辑

注册事件的兼容性处理

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="按钮" id="btn"> <script> var btn = document.getElementById( 阅读全文

posted @ 2019-08-26 16:57 九门宁生 阅读(183) 评论(0) 推荐(0) 编辑

attachEvent

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="按钮" id="btn"> <script> var btn = document.getElementById( 阅读全文

posted @ 2019-08-26 16:55 九门宁生 阅读(156) 评论(0) 推荐(0) 编辑

注册事件

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="按钮" id="btn"> <!-- <script src="user1.js"></ 阅读全文

posted @ 2019-08-26 16:52 九门宁生 阅读(135) 评论(0) 推荐(0) 编辑

节点操作案例10-选择水果

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> select { width:200px; height: 200px; background-color: #33cccc; font-size: 20px; } </style> </head> <body> < 阅读全文

posted @ 2019-08-26 16:16 九门宁生 阅读(180) 评论(0) 推荐(0) 编辑

节点操作案例9-元素操作的方法

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <input type="button" value="按钮" id="btn"> <ul id="ul"> <li>111</li> 阅读全文

posted @ 2019-08-26 16:14 九门宁生 阅读(159) 评论(0) 推荐(0) 编辑

节点操作案例8-效率测试

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>效率测试</title> </head> <body> </body> <script> function fn() { var d1 = +new Date(); for ( var i = 0; i < 1000; i++ ) { var div = do 阅读全文

posted @ 2019-08-26 14:34 九门宁生 阅读(186) 评论(0) 推荐(0) 编辑

节点操作案例7-动态创建表格

摘要: conmon中的内容 阅读全文

posted @ 2019-08-26 14:32 九门宁生 阅读(271) 评论(0) 推荐(0) 编辑

节点操作案例6-动态生成列表

摘要: common中的内容 阅读全文

posted @ 2019-08-26 14:25 九门宁生 阅读(206) 评论(0) 推荐(0) 编辑

节点操作案例5-动态创建元素

摘要: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="box"> <div>111</div> </div> <script> // 在内存中创建一个DOM对象 var p = document.createElem 阅读全文

posted @ 2019-08-26 14:23 九门宁生 阅读(144) 评论(0) 推荐(0) 编辑

节点操作案例4-兄弟节点

摘要: Document 这是一个区域1 这是一个区域2 这是一个区域3 这是一个区域4 这是一个区域5 阅读全文

posted @ 2019-08-26 14:21 九门宁生 阅读(208) 评论(0) 推荐(0) 编辑

创建元素的三种方式

摘要: 创建元素的三种方式 document.write() innerHTML document.createElement() 性能问题 innerHTML方法由于会对字符串进行解析,需要避免在循环内多次使用。 可以借助字符串或数组的方式进行替换,再设置给innerHTML 优化后与document.c 阅读全文

posted @ 2019-08-26 14:19 九门宁生 阅读(279) 评论(0) 推荐(0) 编辑

节点操作案例3-菜单案例

摘要: common中的内容 阅读全文

posted @ 2019-08-26 11:18 九门宁生 阅读(201) 评论(0) 推荐(0) 编辑

节点操作案例1-第一个子节点和最后一个子节点

摘要: Document 这是一个广告图片 这是一个列表 说明性文字 阅读全文

posted @ 2019-08-26 10:37 九门宁生 阅读(526) 评论(0) 推荐(0) 编辑

节点操作案例1-节点层次

摘要: Document span p标签 阅读全文

posted @ 2019-08-26 10:36 九门宁生 阅读(282) 评论(0) 推荐(0) 编辑