随笔分类 - JavaScript
摘要:CMD规范说明 专门用于浏览器端, 模块的加载是异步的 ,模块使用时才会加载执行,github地址 CMD基本语法 定义暴露模块 引入使用模块 CMD规范的实现(浏览器端) CMD规范需要用到sea.js,下载sea.js, 并引入,将sea.js导入项目: js/libs/sea.js 创建项目结
阅读全文
摘要:AMD规范说明 AMD全称是:Asynchronous Module Definition(异步模块定义),github地址 是专门用于浏览器端, 模块的加载是异步的 AMD规范基本语法 定义暴露模块 引入使用模块 未使用AMD规范的模块化 AMD规范的实现(浏览器端) AMD规范需要使用到requ
阅读全文
摘要:commonjs规范说明 每个js文件都可当作一个模块 在服务器端: 模块的加载是运行时同步加载的(不会阻塞,等待时间回比较长)。在浏览器端: 模块需要提前编译打包处理 commonjs规范基本语法 暴露模块:暴露的模块本质上就是exports,exports本来就是一个空的对象,将value赋给它
阅读全文
摘要:模块的概念 一个复杂的项目开发中,会写很多js文件,一个js文件执行某些特定的功能,那么每个js都可以称为一个模块,这就是模块的概念 每个js模块内部数据/实现是私有的, 只是向外部暴露一些接口(方法)与外部其它模块通信 模块化的进化史 全局function模式:将不同的功能封装成不同的全局函数 问
阅读全文
摘要:我们常用的就是鼠标,鼠标中键一般都用于滑动网页,但是网页中很多很炫的效果,使用鼠标滑轮操作更好。当然对于手机就没有这个设备了,所以就不用考虑手机端的实现方法,手机端有触摸滑动事件。使用JavaScript判断鼠标滑轮是向下还是向上滚动,这样有利于我们更加精确的控制滑轮的操作,比如上下滑动改变文本框的...
阅读全文
摘要:函数 勾股定理 可以实现两点坐标求距离的应用 JS中的平方和开方 使用勾股定理计算两点之间的距离,从而实现类似苹果菜单的案例 原理是检测鼠标的位置,然后计算鼠标跟图片的距离,距离最近的图片最大,距离最远的图片最小
阅读全文
摘要:什么是Hybrid App 最开的App开发只有原生开发这个概念,但自从H5广泛流行后,一种效率更高的开发模式Hybrid应运而生,它就是"Hybrid模式" Hybrid APP是目前广泛流行的一种APP开发模式 H5渗入APP开发 我们都知道,原生APP开发中有一个webview的组件(Andr
阅读全文
摘要:用户在使用键盘时会触发键盘事件。“DOM2 级事件”最初规定了键盘事件,结果又删除了相应的内容。最终还是使用最初的键盘事件,不过 IE9 已经率先支持“DOM3”级键盘事件。 一、键码 在发生 keydown 和 keyup 事件时,event 对象的 keyCode 属性中会包含一个代码,与键盘上
阅读全文
摘要:实现拖拽一个元素 拖拽的流程: 当鼠标在被拖拽元素上按下时,开始拖拽 onmousedown 当鼠标移动时被拖拽元素跟随鼠标移动 onmousemove 当鼠标松开时,被拖拽元素固定在当前位置 onmouseup
阅读全文
摘要:事件的委派 在很多需求中,通常元素是动态创建添加到一个父元素中的,这时候我们点击新增的元素是没有反应的 点击新建的超链接,不会有任何反应,没有触发到点击事件。这时候我们希望,只绑定一次事件,即可应用到多个的元素上,即使元素是后添加的 可以尝试将其绑定给元素的共同的祖先元素 指将事件统一绑定给元素的共
阅读全文
摘要:鼠标操作导致的事件对象中的特殊属性和方法 鼠标事件是 Web 上面最常用的一类事件,毕竟鼠标还是最主要的定位设备。那么通过事件对象可以获取到鼠标按钮信息和屏幕坐标获取等 鼠标按钮 只有在主鼠标按钮被单击时(常规一般是鼠标左键)才会触发 click 事件,因此检测按钮的信息并不是必要的 但对于 mou
阅读全文
摘要:事件处理函数概述 JavaScript 可以处理的事件类型为:鼠标事件、键盘事件、HTML 事件 所有的事件处理函数都会都有两个部分组成,on + 事件名称,例如 click 事件的事件处理函数就是:onclick。 对于每一个事件,它都有自己的触发范围和方式,如果超出了触发范围和方式,事件处理将失
阅读全文
摘要:事件处理程序 JavaScript 事件对象是由访问 Web 页面的用户引起的一系列操作,例如:用户点击页面上的某个按钮或者鼠标移动到页面的某个图片上而产生一系列的互动的反馈。 我们通过为指定事件绑定回调函数的形式来处理事 件,当指定事件触发以后我们的回调函数就会被调 用,这样我们的页面就可以完成和
阅读全文
摘要:一、动态加载脚本 当网站需求变大,脚本的需求也逐步变大。我们就不得不引入太多的 JS 脚本而降低了整站的性能,所以就出现了动态脚本的概念,在适时的时候加载相应的脚本。 1、动态加载js文件 比如:我们想在需要检测浏览器的时候,再引入检测文件。 2、动态执行 js IE 6,7,8浏...
阅读全文
摘要:一、clientLeft 和 clientTop 这组属性可以获取元素设置了左边框和上边框的大小,目前只提供了 Left 和 Top 这组,并没有提供 Right 和 Bottom。 二、offsetLeft 和 offsetTop 1、这组属性可以获取当前元素相对于父元素的位置。 获取元素当前相对
阅读全文
摘要:clientWidth 和 clientHeight 这组属性可以获取元素可视区的大小,可以得到元素内容及内边距所占据的空间大小。 返回了元素大小,但没有单位,默认单位是 px,如果你强行设置了单位,比如 100em之类,它还是会返回 px 的大小。(CSS 获取的话,是照着你设置的样式获取)。 对
阅读全文
摘要:通过 style 内联获取元素的大小 需要注意的是style 获取只能获取到行内 style 属性的 CSS 样式中的宽和高,如果有获取;如果没有则返回空。 通过计算获取元素的大小 通过计算获取元素的大小,无关你是否是行内、内联或者链接,它经过计算后得到的结果返回出来。如果本身设置大小,它会返回元素
阅读全文
摘要:使用 style 属性,仅仅只能获取和设置行内的样式,如果是通过内联 测试Div 二、获取CSSStyleSheet对象 这两个元素本身返回的是 HTMLLinkElement 和 HTMLStyleElement 类型,但CSSStyleSheet 类型更加通用一些。得到这个类型...
阅读全文
摘要:使用 style 属性可以设置行内的 CSS 样式,而通过 id 和 class 调用是最常用的方法。 测试Div 不建议通过变换id来改变CSS样式,可以通过class来改变 测试Div 在添加 className 的时候,我们想给一个元素添加多个 class 是没有办法的,后面一...
阅读全文

浙公网安备 33010602011771号