关于 AJAX 的理解
原生AJAX 1.1 AJAX 简介 AJAX 全称为Asynchronous JavaScript And XML,就是异步的 JS 和 XML。 通过AJAX 可以在浏览器中向服务器发送异步请求,最大的优势:无刷新获取数据。 AJAX 不是新的编程语言,而是一种将现有的标准组合在一起使用的新方式。 1.2 XML 简介 XML 可扩展标记语言。 XML 被设计用来传输和存储数据。 XML 和 HTML 类似,不同的是 HTML 中都是预定义标签,而 XML 中没有预定义标签, 全都是自定义标签,用来表示一些数据。 比如说我有一个学生数据: name = "孙悟空" ; age = 18 ; gender = "男" ; 用 XML 表示: 12345<student><name>孙悟空</name><age>18</age><gender>男</gender></student> 用 JSON...
jQuery 入门
jQuery 入门 jQuery 概述 JavaScript 库 JavaScript库:即 library,是一个封装好的特定的集合(方法和函数)。从封装一大堆函数的角度理解库,就是在这个库中,封装了很多预先定义好的函数在里面,比如动画animate、hide、show,比如获取元素等。 简单理解∶就是一个JS文件,里面对我们原生js代码进行了封装,存放到里面。这样我们可以快速高效的使用这些封装好的功能了。 比如jQuery,就是为了快速方便的操作DOM,里面基本都是函数(方法)。 常见的 JavaScript 库 jQuery Prototype YUI Ext JS 移动端的 zepto jQuery 的概念 jQuery 是一个快速、简洁的JavaScript库,其设计的宗旨是“write Less, Do More”,即倡导写更少的代码,做更多的事情。 j 就是 JavaScript;Query查询;意思就是查询 js,把 js 中的DOM 操作做了封装,我们可以快速的查询使用里面的功能。 jQuery 封装了 JavaScript 常用的功能代码,优化了...
PC&移动端网页特效
PC 端网页特效 元素偏移量 offset 系列 offset 概述 offset 翻译过来就是偏移量,我们使用 offset 系列相关属性可以动态的得到该元素的位置(偏移)、大小等 获得元素距离带有定位父元素得到位置 获得元素自身的大小(宽度高度) 注意:返回的数值都不带单位 常用属性 offsetTop offsetLeft 以带有定位的父亲为准 offsetParent 返回带有定位的父亲,否则返回 body offsetWidth offsetHeight 元素可视区 client 系列 概述 client 翻译过来就是客户端,我们使用 client 系列的相关属性来获取元素可视区的相关信息。通过client系列的相关属性可以动态的得到该元素的边框大小、元素大小等。 元素滚动 scroll 系列 概述 scroll 翻译过来就是滚动的,我们使用 scroll 系列的相关属性可以动态的得到该元素的大小、滚动距离等 动画函数封装 动画实现原理 通过定时器 setInterval()...
关于高级事件和 BOM 浏览器对象类型
高级事件 注册事件 给元素添加事件成为注册事件或者绑定事件 传统方式和方法监听注册方式 传统注册 利用 on 开头的事件 onclick 1<button onclick = alert("hi~")></button> 1btn.onclick = function(){} 特点:注册事件的唯一性 同一元素同一事件只能设置一个处理函数,最后注册的处理函数将会覆盖前面注册的处理函数 方法监听注册方式 w3c 标准 推荐方式 addEventListener() 是一个方法 1addEventListener(type, listener[, useCapture]) type 事件类型字符串,比如click mouseover 注意这里不要带on listener 事件处理函数,事件发生时,会调用该监听函数 可选参数,是一个布尔值,默认是false attachEvent 事件监听方式 ie9 之前的版本支持 生产版本一般不使用 IE9 之前的 IE...
关于 API 与 DOM 的理解
关于 API API Application Programming Interface, 应用程序编程接口,是一些预先定于的函数,目的是提供应用程序与开发人员基于某硬件或软件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。 API是给程序员提供的某种工具,以便能更轻松的实现想要完成的功能 WEB API 是浏览器提供的一套操作浏览器功能和页面元素的API(BOM和DOM),MDN API: https://developer.mozilla.org/zh-CN/docs/Web/API DOM DOM 简介 什么是 DOM 文档对象模型(Document Object Model,简称 DOM),是W3C组织推荐的处理可拓展标记语言(HTML 或者 XML)的标准编程接口 DOM树 W3C已经定义了一系列的DOM接口,通过这些 DOM 可以改变网页的结构和样式 文档:一个页面就是一个文档,DOM中使用 document 表示 元素:页面中的所有标签都是元素,DOM中使用 element...
我的星座分析
...
前端代码规范(1)
代码规范 1. 概述 欢迎使用品优购代码规范, 这个是我借鉴京东前端代码规范,组织的品优购内部规范。旨在增强团队开发协作、提高代码质量和打造开发基石的编码规范, 以下规范是团队基本约定的内容,必须严格遵循。 HTML规范 基于 W3C、苹果开发者 等官方文档,并结合团队业务和开发过程中总结的规范约定,让页面HTML代码更具语义性。 图片规范 了解各种图片格式特性,根据特性制定图片规范,包括但不限于图片的质量约定、图片引入方式、图片合并处理等,旨在从图片层面优化页面性能。 CSS规范 统一规范团队 CSS 代码书写风格和使用 CSS 预编译语言语法风格,提供常用媒体查询语句和浏览器私有属性引用,并从业务层面统一规范常用模块的引用。 命名规范 从 目录、图片、HTML/CSS文件、ClassName 的命名等层面约定规范团队的命名习惯,增强团队代码的可读性。 2. HTML 规范 DOCTYPE 声明 HTML文件必须加上 DOCTYPE 声明,并统一使用 HTML5 的文档声明: 1<!DOCTYPE...
不要死,也不要孤独的生活
...
杂聊4
...
杂聊3
...