随笔分类 - Web前端开发
摘要:1 基本概念 1.1 事件 JavaScript与HTML之间的交互是通过事件实现的。 事件是文档或浏览器窗口中发生的一些特定的交互瞬间,在事件上可以注册处理程序,以便当事件发生时,处理程序中的代码得到执行(这种模型对应设计模式中的观察者模式)。 1.2 事件流 事件流描述的是从页面接受事件的顺序。
阅读全文
摘要:在开启JSX的学习旅程前,我们先了解一下React的基本原理。React本质上是一个"状态机",它只关心两件事:更新DOM和响应事件,React不处理Ajax、路由和数据存储,也不规定数据组织的方式。它不是一个MVC的框架,只是MVC里的"V"。 在每次状态改变时,使用JavaScript重新渲染整
阅读全文
摘要:1 工欲善其事必先利其器:前端开发工具 1.1 WebStorm和Sublime Text Sublime Text:作为代码编辑器,Sublime Text的优点如下: 主流前端开发编辑器 体积较小,运行速度快 文本功能强大 支持编译功能且可在控制台看到输出 内嵌python解释器支持插件开发以达
阅读全文
摘要:1 背景 伴随着项目功能的不断扩充,客户体验的不断完善,实现交互逻辑的JS代码变得越来越多。起初,为了管理JS代码,我们把JS从页面中解放出来独立成文件,接着又把相似的交互代码提取到公共的JS页面中。然而这还不够,一个团队在编写JS交互逻辑时,往往会出现"命名冲突"的问题。于是乎,我们想到了闭包,并
阅读全文
摘要:1 自定义菜单导航栏插件的必要性 看图说话,下面是利用自定义的菜单导航栏插件simpleMenu创建的网站导航示例: 插件默认提供的是如上图的导航栏样式,即一二级菜单为横向分布;三四级菜单为纵向分布。 使用插件时,可以修改默认参数,目前插件提供了设置菜单的分布方式:横向或纵向;菜单的位置:...
阅读全文
摘要:1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家。 1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素 3.鼠标离开后的正确、错误提示及鼠标移入时的帮助提醒 对于初学者而言,html表单验证是一项极其琐碎的事情。要做好表单验证,需要准备以...
阅读全文