commit b37417dedb251d9a4dfe38c6c5cb9c17f82247cd Author: RainSunMee Date: Sun Oct 13 14:11:30 2019 +0800 first commit diff --git a/20190925/20190925.md b/20190925/20190925.md new file mode 100644 index 0000000..99e01e9 --- /dev/null +++ b/20190925/20190925.md @@ -0,0 +1,47 @@ +# 20190925 + +![js](https://img.shields.io/badge/language-js-orange.svg) + +* 给任意元素添加监听器封装函数 +```js + function addEventListener(ele,type,fn) { + if(ele.addEventListener) { + ele.addEventListener(type,fn,false) + } else if (ele.attachEvent) { + ele.attachEvent('on' + type, fn) + } else { + ele['on' + type] = fn + } + } + +``` +* 给任意事件解绑监听器封装函数 + +```js + //如需解绑监听器,则添加事件必须为命名函数 + function removeEventListener(ele, type, fn) { + if(ele.removeEventListener) { + ele.removeEVentListener(type, fn, false) + } else if (ele.detachEvent) { + ele.detachEvent('on' + type, fn) + } else { + ele['on' + type] = fn + } + } + +``` + +* 阻止事件冒泡 + +```js +//e | window.event :事件参数对象,前者是w3c,后者IE + +//google,ie8 | firefox不支持 +//火狐不支持 window.event +window.event.cancelBubble = true; +e.cancelBubble = true; + +//w3c firefox,google | ie8不支持 +e.stopPropagation(); + +``` \ No newline at end of file diff --git a/20190926/20190926.html b/20190926/20190926.html new file mode 100644 index 0000000..a3bc291 --- /dev/null +++ b/20190926/20190926.html @@ -0,0 +1,52 @@ + + + + + + + Document + + + + + + + \ No newline at end of file diff --git a/20190926/20190926.md b/20190926/20190926.md new file mode 100644 index 0000000..2dfbc96 --- /dev/null +++ b/20190926/20190926.md @@ -0,0 +1,47 @@ +# 20190925 + +![js](https://img.shields.io/badge/language-js-orange.svg) +[linkToHtml](./20190926.html) + +* 事件的阶段 + * e.eventPhase 通过这个知道之间的阶段 + 1. 事件捕获 => 从外向里 + 2. 目标阶段 => + 3. 冒泡阶段 => 从里向外 + +* 绑定事件 addEventListener('不带on的事件类型',函数,<控制事件阶段>) + * <控制事件阶段> => false => 冒泡阶段 + * <控制事件阶段> => true => 事件捕获 + +```js +// 前提 div.box1>div.box2>div.box3,且各个div绑定打印id的点击事件 +my$('box3').addEventListener('click',fn,false); +// box3 -> box2 -> box1 +my$('box3').addEventListener('click',fn,true); +// box1 -> box2 -> box3 +``` + +* onmouseover|out 鼠标移入移出事件 + +* e.type 获取当前事件 +```js + my$('btn').onclick = f1; + my$('btn').onmouseover = f1; + my$('btn').onmouseout = f1; + + function f1(e) { + switch(e.type){ + case 'click': + //点击TODO + break; + case 'mouseover': + //鼠标移入TODO + break; + case 'mouseout': + //鼠标移出TODO + break; + } + } +``` + +* a标签 href属性为 javascript:; 阻止默认事件 diff --git a/20191009/20191009.md b/20191009/20191009.md new file mode 100644 index 0000000..038542d --- /dev/null +++ b/20191009/20191009.md @@ -0,0 +1,33 @@ +# 20191009 + +![js](https://img.shields.io/badge/language-js-orange.svg) + + +* window + * 所有变量属于window + * name,top 属于window自有属性,不可声明 + * 属性以及方法`functionName`可以省略window + * `window.confirm();`模态框,返回Boolean + * `window.promit('str',defaultStr);`输入框返回str + * `window.onload` 页面加载完成事件 + * `window.onunload` 页面关闭之后 + * `window.onbeforeunload` 页面关闭之前 + +* BOM + * location + * href 页面跳转 + * hash 地址#后边的内容 + * host 主机和端口号 + * hostname 主机名 + * pathname 文件路径(相对路径) + * port 端口 + * protocol 协议 + * search ?后边的内容(参数) + * `assign()` 跳转页面方法 + * `replace()` 无记录跳转 + * reload 重载 + + * history + * `go()` 页面跳转``个 + * `back()` 回退 + * `forward()` 前进 \ No newline at end of file diff --git a/20191013/20191013.md b/20191013/20191013.md new file mode 100644 index 0000000..da22a06 --- /dev/null +++ b/20191013/20191013.md @@ -0,0 +1,3 @@ +# 20191013 + +![js](https://img.shields.io/badge/language-js-orange.svg) \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..d869a82 --- /dev/null +++ b/README.md @@ -0,0 +1,43 @@ +# 吉软大前端笔记本 + +## 20190925 + +![js](https://img.shields.io/badge/language-js-orange.svg) +[linkToMd](./20190925/20190925.md) + +* 给任意元素添加监听器封装函数 +* 给任意事件解绑监听器封装函数 +* 阻止事件冒泡 + +--- + +## 20190926 + +![js](https://img.shields.io/badge/language-js-orange.svg) +[linkToMd](./20190926/20190926.md) + +* 事件的阶段 +* 绑定事件 addEventListener('不带on的事件类型',函数,<控制事件阶段>) +* onmouseover|out 鼠标移入移出事件 +* e.type 获取当前事件 +* a标签 href属性为 javascript:; 阻止默认事件 + +--- + +## 20191009 + +![js](https://img.shields.io/badge/language-js-orange.svg) +[linkToMd](./20191009/20191009.md) + +* window +* history +* location + +--- + +## 20191013 + +![js](https://img.shields.io/badge/language-js-orange.svg) +[linkToMd](./20191013/20191013.md) + +