19 引用
引用类型通常被叫做类（class）。但在 ECMAScript 2015 版本之前的 JavaScript 中并没有类的概念，在 JavaScript 中通常叫做对象定义。 也就是说，使用引用类型其实就是使用对象（该内容在后面的章节学习）。 JavaScript 中预定义了很多的引用类型，其中包含之前学习的包装类型 Boolean、Number 和 String。 下述列表罗列了 JavaScript 中所提供的引用类型: 引用类型 说明 Date类型 获取和设置当前日期时间。 Math类型 用于数学计算。 Global类型 全局对象，提供全局属性和全局方法。 Array类型 用于有序的存储多个值。 RegExp类型 用于对字符串模式匹配及检索替换，是对字符串执行模式匹配的强大工具。 Error类型 用于匹配代码错误并提供对应提示内容。 Functions类型 用于定义 JavaScript 中的函数。 Object类型 用于定义 JavaScript 中的对象。 Date类型创建 Date 对象JavaScript 中并没有提供日期的...
11 引入
JavaScript 类库 作用: JavaScript 类库的出现，就是为了简化 JavaScript 的开发。 内容: JavaScript 类库封装了预定义的对象和函数。 目的: 帮助开发人员建立有高难度交互的 Web 2.0 特性的富客户端页面，并且兼容各大浏览器。 扩展内容 Web 2.0 相关概念: Web 1.0: 网络 -> 人（单向信息。网络是信息提供者，单向的提供和单一理解） Web 2.0: 人 -> 人（以网络为沟通渠道进行人与人沟通。网络是平台，用户提供信息，通过网络，其他用户获取信息） Web 3.0: 人 -> 网络 -> 人（人与网络之间的双向沟通。网络成为用户需求理解者和提供者） 富客户端与瘦客户端： 富客户端:（Rich Internet Applications，RIA）利用具有很强交互性的富客户端技术来为用户提供一个更高和更全方位的网络体验。 瘦客户端:（Thin Client）指的是在客户端-服务器网络体系中的一个基本无需应用程序的计算机终端。 jQuery 的编程步骤 在 HTML 页面引入 jQu...
13 Dom
DOM 是 Document Object Model 的缩写，译为 文档对象模型。根据 W3C DOM 规范，DOM 是一种与浏览器、平台、语言无关的接口，使用该接口可以轻松地访问页面中所有的标准组件。 jQuery 中另一个重要的组成部分就是封装了原生 DOM 的操作。 基本操作html操作html() 方法用于读取或设置指定元素的 HTML 代码，类似于原生 DOM 中的 innerHTML 属性。 12345678//获取<p>元素的HTML代码$("input:eq(0)").click(function(){ alert( $("p").html() );});//设置<p>元素的HTML代码$("input:eq(1)").click(function(){ $("p").html("<strong>你最讨厌的水果是?</strong>");}); 文本操作text...
12 动画
显示和隐藏效果通过同时改变元素的宽度和高度来实现显示或者隐藏。 无动画效果 显示: show() 隐藏: hide() 12345678$("#panel h5.head").click(function(){ var $content = $(this).next("div.content"); if($content.is(":visible")){ $content.hide(); }else{ $content.show(); }}) 有动画效果显示: show(speed,callback) speed: 预定义三种速度”slow”、”normal”和”fast”，或自定义时间，单位为毫秒。 callback: 动画执行完毕后的回调函数。 隐藏: hide(speed,callback) speed: 预定义三种速度”slow”、”normal”和”fast”，或自定义时间，单位为毫秒。 callb...
14 事件
页面加载原生 DOM 中的事件具有页面加载的内容 onload 事件，在 jQuery 中同样提供了对应的内容ready() 函数。 ready与onload之间的区别 onload ready 没有简写方式 具有简写方式 当HTML页面所有内容加载完毕后才执行onload 当DOM节点加载完毕后就执行ready 一个HTML页面只能编写一个onload 一个HTML页面允许同时编写多个ready ready()的编写方式 $(document).ready(function(){}); $().ready(function(){}); $(function(){}); 事件绑定jQuery 中提供了事件绑定与解绑机制，类似于原生 DOM 中的 addEventListener() 方法。 jQuery 的事件绑定单事件绑定单事件绑定就是指为指定元素绑定一个指定的事件，例如 click、change 等。 1234567891011121314151617<div id="panel"> <h5 class=&q...
15 插件
日期插件layDate 日期插件致力于成为全球最用心的 web 日期支撑，为国内外所有从事 web 应用开发的同仁提供力所能及的动力。 1234567891011121314<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>01_laydate插件的基本使用</title> <script src="laydate/laydate.js"></script></head><body> <input placeholder="请输入日期" class="laydate-icon" onclick="laydate()"> <br> <input placeholder="请输入日期&qu...
16 选择器
什么是 jQuery 的选择器jQuery 的选择器的想法是源于 CSS 中的选择器的用法，其实在 JavaScript 中也有类似的用法，比如 querySelector() 或 querySelectorAll() 方法的使用，也是借助 CSS 中的选择器来定位 HTML 页面元素的。只不过相比 jQuery 中的选择器，JavaScript 中的 querySelector() 或 querySelectorAll() 方法的性能相对差一些而已。 jQuery 的选择器最主要的作用就是用于定位 HTML 页面的元素。它不仅可以定位 HTML 页面中具体某个元素，还可以通过各种方式定位复合条件的一组元素等等。 值得注意的是: jQuery 的选择器最大的特点就是将定位元素和元素行为进行了有效的分离。这是在实际开发中非常必要的一项特点！ jQuery 选择器的种类jQuery 中使用其工厂函数 $() 作为容器，来接收 jQuery 的选择器内容。而 jQuery 的选择器则以字符串形式传递给 jQuery 的工厂函数。 jQuery 的选择器种类大概可以分为以下几种: 基...
17 效果
jQuery UI 能做的事可谓是包罗万象。实际上，jQuery UI 在某种意义上并不是插件，而是一个完整的插件库。 jQuery UI 中主要包含以下几个功能: Effect（效果） Interactions（交互组件） Widget（部件） 此外，还为jQuery和核心动画提供了很多高级效果。 Effect（效果）animate() 方法文档在引入核心效果文件的情况下，扩展的 .animate() 方法可接受另外一些样式属性。 扩展后 animate 方法接受以下属性: backgroundColor borderBottomColor borderLeftColor borderRightColor borderTopColor Color outlineColor 1234567891011121314151617var state = true;$( "#button" ).click(function() { if ( state ) { $( "#effect" ).animate({...
18 数组与遍历
类数组对象就是结构上类似于数组的对象，该对象具备数组的一些特性属性或方法，同时具有自己独特的一些属性或方法。 数组与类数组对象的区别 数组的类型是 Array 类数组对象的类型是 Object 类数组的操作 length属性：获取指定元素的个数。 eq(index)：将下标等于index的DOM对象取出来。 get(index)：返回一个DOM对象组成的数组。 index（obj）：返回DOM或jQuery对象在类数组中的下标。 遍历方法$(selector).each(callback) 方法 callback：回调函数，function(index,domEle){} index：遍历过程中的索引值 domEle：遍历后得到的DOM对象 123$("input").each(function(index,domEle){ console.log(domEle.value);}); $.each(obj,callback) 方法 obj：需要遍历的对象或数组。 callback：回调函数，function(index,...
1 getting-started
什么是BOOTSTRAP1）BOOTSTRAP概述Bootstrap 是 Twitter 公司开发的一个基于 HTML、CSS、JavaScript 的技术框架，符合 HTML、CSS 规范，且代码简介、视觉优美。 Bootstrap 集合 HTML、CSS 和 JavaScript，使用了最新的浏览器技术，为实现快速开发提供了一套前端工具包。使用 Bootstrap 不仅可以构建出非常优雅的 HTML 页面，而且占用资源非常少，使用 gzip 压缩后大小仅用 10KB。并且 Bootstrap 在跨浏览器兼容方面表示也很好。 2）选择BOOTSTRAP的理由 Bootstrap 的 HTML 是基于 HTML5 的最新技术。 Bootstrap 可以快速实现响应式页面。 Bootstrap 集成了非常友好的 CSS 样式表，对于非设计人员也可以制作出很漂亮的网页。 3）BOOTSTRAP提供的功能根据 Bootstrap 官网提供的文档，可以知道 Bootstrap 分为以下几个模块： 全局 CSS 样式：提供了格栅系统、表格、表单、按钮等集成样式。 组件：提供了下拉菜单、...
