自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

front_end_fan

以大多数人的努力程度之低,根本轮不到拼天赋。

  • 博客(307)
  • 资源 (9)
  • 收藏
  • 关注

原创 js基础-File API ★★★

File API3、文件系统API3.1 File API在HTML5中新增了File API,可以让网页要求用户选择本地文件,并且读取这些文件的信息。选择的方式可以是HTML<input>元素,也可以是拖拽。<input type="file" id="photo">var selectedFile = document.getElementById('photo'); var file = s

2017-09-22 09:05:07 1608

原创 js基础-客户端存储(Cookie、Storage、IndexedDB)

Canvas二、canvasHTML5<canvas>元素用于图形的绘制,通过脚本 (通常是JavaScript)来完成。<canvas>标签只是图形容器,您必须使用脚本来绘制图形。要使用Canvas API,首先需要新建一个<canvas>网页元素<canvas id="canvas" width="400" height="200"> 您的浏览器不支持canvas! </canvas>

2017-09-22 08:35:48 1128 1

原创 js基础-canvas

Canvas二、canvasHTML5<canvas>元素用于图形的绘制,通过脚本 (通常是JavaScript)来完成。<canvas>标签只是图形容器,您必须使用脚本来绘制图形。要使用Canvas API,首先需要新建一个<canvas>网页元素<canvas id="canvas" width="400" height="200"> 您的浏览器不支持canvas! </canvas>

2017-09-21 10:38:17 387

原创 js基础-富文本编辑器

富文本编辑器1、富文本编辑器简介富文本编辑(WYSIWYG(What You See Is What You GET,所见即所得))。最先的富文本编辑,就是在页面中嵌入一个包含空HTML页面的iframe,然后通过设置designMode属性,这个空白的HTML页面就可以编辑了,编辑对象则是该页面<body>元素的HTML代码。 designMode属性有两个可能的值:“off”和“on”,默认为

2017-09-21 10:30:27 4086

原创 js基础-表单

表单Web表单是开发人员与用户交互的重要控件。1、form1.1 form独有的属性和方法在HTML中,表单是由<form>来表示的,而在JavaScript中,表单对应的是HTMLFormElement类型。HTMLFormElement继承了HTMLElement,因此它跟其他HTML元素具有相同的默认属性。<form>也有自己独有的属性和方法:acceptCharset:服务器能够处理的字符集

2017-09-21 10:15:08 2066

原创 js基础-AJAX、file、http进度、同源策略

AJAX超文本传输协议(HyperText Transfer Protocol,HTTP)是用于从WWW服务器传输超文本到本地浏览器的传输协议(transport)。它可以使浏览器更加高效,使网络传输减少。Ajax(Asynchronous JavaScript and XML)描述了一种主要使用脚本操纵HTTP的Web应用架构。Ajax的主要特点是使用脚本操纵HTTP和Web服务器进行数据交换,不

2017-09-21 09:56:34 608

原创 js基础-引用类型-console对象 ★☆

console对象console对象是JavaScript的原生对象,可以将信息输出在控制台。1、打开控制台不同系统平台打开浏览器的控制台可能有些不一样,下面以chrome浏览器为例,可以使用下列方式打开:按F12鼠标右键里选择“检查”在右上角的菜单中点击“更多工具/开发者工具”打开控制台以后,你可以看到下列不同的面板:Elements:查看网页的HTML源码和CSS代码。 Resources:查

2017-09-21 09:07:07 472

原创 js基础-单体内置对象(Global、Math)

单体内置对象(Global、Math)内置对象也就是我们不必显示地区实例化,直接就可以使用了,因为它们已经实例化了。1、Global 对象Global对象是一个全局对象。所有在全局作用域中定义的属性和函数,都是Global对象的属性,比如:isNaN()、isFinite()、parseInt()以及parseFloat(),实际上都是Global对象的方法,它还包括了其他一些方法:1.1 Glob

2017-09-21 08:59:34 3346

原创 js基础-基本包装类型(Boolean、Number、String )★☆

基本包装类型(Boolean、Number、String)1、基本包装类型简介ECMAScript提供了三个基本包装类型:Boolean、Number、String。实际上,每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而让我们能过调用一些方法来操作这些数据。执行步骤如下:创建S提让那个类型的一个实例在实例上调用指定的方法销毁这个实例var s1 = new String

2017-09-21 08:55:27 389

原创 js基础-引用类型-Date对象 ★☆

Date类型在JavaScript中,Date类型是用来保存日期的,它能精确到1970年1月1日之前或之后的285616年。1、创建日期对象要创建一个日期对象,使用new操作符和Date构造函数即可:var now = new Date();//Thu Sep 21 2017 08:41:51 GMT+0800 (中国标准时间) 在调用Date构造函数而不传递参数时,新创建的对象自动获得当前日期和

2017-09-21 08:44:12 329

原创 js基础-引用类型-Array对象 ★★★☆

Array类型ECMAScript数组的每一项可以保存任何类型的数据,也就是说,而且数组的大小是可以动态调整的,即可以随着数据的添加自动增长以容纳新增数据。var colors = [1, 'tg', {}]; 在上面的例子中,数组中保存了数值、字符串和对象。1、初始化数组实例创建数组的基本方式有多种:(1)使用Array构造函数当传递一个参数时,如果传递的参数是数值,则会按照该数值创建包含给定项

2017-09-21 08:39:45 196

原创 js基础-引用类型-Object对象 ★★★☆

Object类型1. 实例化对象所有其他对象都继承Object。创建object实例的方式有两种:第一个种是使用new操作符后跟Object构造函数var person = new Object() 注意:O是大写第二种是使用对象字面量:var person = { name: 'tg' }; 访问对象属性使用的是点表示法,也可以用方括号表示法来访问。var person = {

2017-09-21 08:33:14 232

原创 js基础-JSON

JSONJSON(JavaScript Object Notation,JavaScript对象表示法),它是JavaScript的一个严格子集。JSON只是一种简单数据格式,并不是只有JavaScript拥有。1、语法JSON对值的类型和格式有严格的规定:复合类型的值只能是数组或对象,不能是函数、正则表达式对象、日期对象。简单类型的值只有四种:字符串、数值(必须以十进制表示)、布尔值和null(不

2017-09-20 13:44:05 296

原创 js基础-正则表达式★★★

正则表达式正则表达式(regular expression)是一个描述字符模式的对象。JavaScript的RegExp类表示正则表达式,String和RegExp都定义了方法。1.1 正则表达式的定义正则表达式有两种方法定义:一种是使用正则表达式直接量,将其包含在一对斜杠(/)之间的字符。var pattern = /s$/; 另一种是使用RegExp()构造函数。var pattern = n

2017-09-20 13:35:18 856

原创 js基础-Event 事件★★★

Event 事件客户端JavaScript程序采用了异步事件驱动编程模型。一、相关术语事件流描述的是从页面中接收事件的顺序。事件就是Web浏览器通知应用程序发生了什么事情。事件类型(event type)是一个用来说明发生什么类型事件的字符串。例如,“mousemove”表示用户移动鼠标,“keydown”表示键盘上某个键被按下等等。事件目标(event target)是发生的事件与之相关的对象。当

2017-09-20 12:40:31 1322

原创 js基础-BOM

BOMWindow对象是客户端JavaScript程序的全局对象。11.1 计时器setTimeout()和setInterval()可以用来注册在指定的时间之后单次或重复调用的函数。两者都是客户端JavaScript中的全局函数,也就是Window对象的方法。(1)setTimeout()setTimeout()方法用来实现一个函数在指定的毫秒数之后运行,返回一个值,这个值可以传递给clearTi

2017-09-20 11:33:49 393

原创 js基础-DOM-属性和CSS

DOM–属性和CSS一、属性HTML元素由一个标签和一组称为属性(attribute)的名/值对组成。1、HTML属性作为Element的属性表示HTML文档元素的HTMLElement对象定义了读写属性,它们映射了元素的HTML属性。HTMLElement定义了通用的HTTP属性(如id、标题lang和dir)的属性,以及事件处理程序属性(如onclick)。特定的Element子类型为其元素定义

2017-09-20 11:27:01 461

原创 js基础-DOM

DOM1、DOM文档对象模型(Document Object Model,DOM)是表示和操作HTML和XML文档内容的基础API。当网页被加载时,浏览器会根据DOM模型,将结构化文档(比如HTML和XML)解析成一系列的节点,再由这些节点组成一个树状结构(DOM Tree)。如下图:上图中的每一个方框是文档的一个节点,它表示一个Node对象,而所有节点组成了节点树(DOM树)。节点有7种类型:

2017-09-20 11:07:25 310

原创 js基础-函数★★★

函数1.函数简介通过函数可以封装任意多条语句,而且可以在任何地方、任何时候调用。ECMAScript中的函数使用function关键字来声明,后跟一组参数以及函数体,这些参数在函数体内像局部变量一样工作。function functionName(arg0, arg1....argN) { statements } 函数调用会为形参提供实参的值。函数使用它们实参的值来计算返回值,称为该函数

2017-09-20 10:29:33 392

原创 js基础-数组★★★

数组1.数组简介数组是值的有序集合。每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示(从0开始),称为索引,整个数组用方括号表示。var arr = [1,2,3]; 除了在定义时赋值,数组也可以先定义后赋值。var arr = []; arr[0] =1; 数组元素可以是任意类型。var arr = [1,'a',{name:'a'},function(){}]; 上面数组a

2017-09-20 09:35:42 323

原创 js基础-对象★★★

对象JavaScript是面向对象编程(Object Oriented Programming,OOP)语言。面对对象编程的核心思想就是是将真实世界中各种复杂的关系,抽象成一个个对象,然后由对象之间分工合作,完成对真实世界的模拟。何为对象?对象是单个实物的抽象。 一本书、一辆汽车、一个人都可以是“对象”,一个数据库、一张网页也可以是“对象”。世界上所有的对象都可以是“对象”。对象是一个容器,封装了

2017-09-20 09:24:56 1271

原创 js基础-语句

语句表达式在JavaScript中是短语,而语句(statement)就是JavaScript整句或命令。JavaScript语句是以分号结束。默认情况下,JavaScript解释器依照语句的编写顺序依次执行。1. 表达式语句(1) 复合语句我们可以用花括号将多条语句括起来,这就是复合语句(语句块)。{ var a = 1; var b = 1; } (2)空语句分号前面可以没有任何

2017-09-20 08:29:00 530

原创 js基础-表达式

表达式表达式(expression)是JavaScript中的一个短语,JavaScript解释器会将其计算出一个结果。将简单表达式组合成复杂表达式最常用的方法就是使用运算符(operator)。运算符按照特定的运算规则对操作数进行运算,并计算出新值。1、表达式1.1 原始表达式原始表达式是表达式的最小单位—它们不包含其他表达式。JavaScript中的原始表达式包含常量、直接量、变量或关键字。直接

2017-09-19 17:10:49 413

原创 js基础-运算符

1 运算符ECMA-262描述了一组用于操作数据值的运算符,包括算术运算符、位运算符、关系运算符和相等运算符。1.1 一元运算符只能操作一个值的运算符叫做一元运算符。1.递增和递减递增(++)和递减(–)都有两种使用方式:前置型和后置型。前置型指的是运算符放在要操作的变量之前,而后置型则是运算符放在要操作的变量之后。var age = 10; var age2 = 10; ++age; --a

2017-09-19 17:07:27 572

原创 js基础-数据类型

2.4 数据类型ECMAScript中有5种简单数据类型(基本数据类型):Undefined、Nul、Boolean、Number和String。还有1种复杂数据类型–Object,Object本质上是由一组无序的名值对组成的。 注:在ES6中新增了Symbol。2.4.1 typeof操作符typeof操作符用来检测给定变量的数据类型,可能的返回值:"undefined" 这个值未定义 "b

2017-09-19 16:18:30 467

原创 js基础-语法

##语法##2.1 语法JavaScript程序是用Unicode字符集编写的。2.1.1 区分大小写JavaScript中的一切(变量、函数名和操作符)都区分大小写。比如变量名test和变量名Test代表的是两个不同的变量。2.1.2 标识符标识符是指变量、函数、属性的名字,或函数的参数。标识符格式规则:第一个字符必须是一个字母、下划线(_)或一个美元符号($)所以有了以_为所写的undersco

2017-09-19 15:58:53 648

原创 JQuery学习笔记整理:工具类

jQuery还提供了很多辅助工具方法,使用这些方法可以很方便的进行操作js代码逻辑。使用方法会在后面一一给出例子:each()  用于遍历指定的对象和数组,并以对象的每个属性(或数组的每个成员)作为上下文来遍历执行指定的函数。map()  用于使用指定函数处理数组中的每个元素(或对象的每个属性),并将处理结果封装为新的数组返回。boxModel  检测当前页面中浏览器是否使用标准盒模型渲染页面(从1

2017-09-19 12:04:44 409

原创 常用的SQL语句

常用的SQL语句 常用的SQL语句整理。数据库操作create database dbname;  //创建数据库drop database dbname;  //删除数据库表操作create table tablename(column_name1 data_type(size) [not null] [primary key],column_name2 data_type(size) [

2017-09-19 08:58:16 472

原创 JS常用的时间方法总结

这篇文章主要是分享几个比较常用的时间方法:时间格式化获取前几天或后几天的日期获取某月有多少天获取星期几获取两个日期时间差//格式化日期   Date.prototype.Format = function(fmt) {     var o = {       "M+": this.getMonth() + 1, //月份          "d+": this.getDate(), //日

2017-09-19 08:36:17 512

原创 重温CSS实现单行、多行文本溢出显示省略号(…)

我们先来看效果图,如下:代码实现://单行.single-line{   width:200px;   overflow:hidden;   white-space:nowrap;     text-overflow:ellipsis;}<div class="single-line"></div>//多行.multiple-line{     width:200px;     display:-w

2017-09-19 08:14:44 472

原创 JavaScript常用方法整理

一、StringchatAt()   //返回在指定位置的字符,第一个位置是0。(string.chatAt(0))concat()   //连接两个或更多字符串,返回新的字符串(string.concat(string1, string2, ..., stringX))indexOf()   //返回某个指定的字符串值在字符串中首次出现的位置。区分大小写,如果没有找到匹配的字符串则返回 -1。(s

2017-09-19 08:12:38 398

原创 常用浏览器私有属性小技巧

更改输入框文字placeholder颜色::-webkit-input-placeholder { color: orange;}::-moz-input-placeholder { color:orange;}::-ms-input-placeholder { color: orange;}::input-placeholder { color: orange

2017-09-19 08:10:07 779

原创 JS节点的属性及方法

前言学习了jquery等类库,可不能”忘本“,原生js才是它的根基。 ”但是前端技术发展到今天,如果你时常关注Github上一些流行的开源JS项目,你会发现这样一种趋势:开发者们越来越倾向于使用原生代码,而不依赖与第三方库。“一、属性Attributes 存储节点的属性列表(只读)childNodes 存储节点的子节点列表(只读)dataType 返回次节点的数据类型documen

2017-09-18 16:21:33 2366

原创 重温Flex布局

Flex布局,可以简便、完整、响应式地实现各种页面布局。浏览器支持:得到所有浏览器的支持。(注:Flex布局将成为未来布局的首选方案)一. Flex布局的概念:Flex是Flexible Box的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。div{ display: flex;}/*行内元素*/div{ display: inline-fl

2017-09-18 15:55:41 716 1

翻译 浏览器渲染Rendering那些事:repaint、reflow/relayout、restyle

有没有被标题中的5个“R”吓到?今天,我们来讨论一下浏览器的渲染(Rendering)-一个产生于Page 2.0生命周期中,甚至有时候会在下载瀑布流中出现的过程。我们来讨论浏览器在接收到HTML、CSS和JavasSript后,如何把你的页面呈现在屏幕上。一、浏览器渲染过程不同的浏览器的渲染过程存在些许不同,但大体的机制是一样的,下图展示的是浏览器自下载完全部的代码后的大致流程首先,浏览器

2017-09-18 15:17:53 637

翻译 JavaScript中5个值得被广泛使用的数组方法

在2009年十月ECMAScript 5被定义正式规范以来,一些可以提高工作效率的数组方法被提出。但是,由于ES5糟糕的浏览器支持率,这些方法并未被开发者广泛使用。“多余的”数组方法 没有人会质疑这些方法的可用性,但是如果针对它们而编写polyfill(关于polyfill,个人理解就是为了使新方法兼容各浏览器而编写的浏览器“插件”或者扩展,可以参考这篇文章)却并不值得。所以,这些新方法被认为是

2017-09-18 15:01:42 522

原创 不惧面试:HTTP协议(3) - Cookie

阅读目录面试常见题:参考答案:v博客前言先交代下背景,写这个系列的原因是总结自己遇到的面试题以及可能遇到的题目,更重要的是,今年定的目标是掌握网络这一块的知识点,先是搞懂HTTP协议,然后是TCP/IP协议,再就是WCF如何运用这些协议更好地工作。 不惧面试:HTTP协议(1) - 基础扫盲不惧面试:HTTP协议(2) - 网关、隧道和中继不惧面试:HTTP协议(3) - Cookie不惧

2017-09-18 14:36:03 487

原创 不惧面试:HTTP协议(1) - 基础扫盲

阅读目录面试常见题:参考答案: 前言先交代下背景,写这个系列的原因是总结自己遇到的面试题以及可能遇到的题目,更重要的是,今年定的目标是掌握网络这一块的知识点,先是搞懂HTTP协议,然后是TCP/IP协议,再就是WCF如何运用这些协议更好地工作。 不惧面试:HTTP协议(1) - 基础扫盲不惧面试:HTTP协议(2) - 网关、隧道和中继不惧面试:HTTP协议(3) - Cookie不惧面

2017-09-18 14:18:56 547

原创 学会git玩转github,结尾有惊喜!有惊喜!有惊喜!

<div class="postBody"> <div id="cnblogs_post_body"><h2>一、什么是Github</h2>Github是全球最大的社交编程及代码托管网站(https://github.com/)。Github可以托管各种git库,并提供一个web界面(用户名.github.io/仓库名)二、Github和Git是什么关系 Git是版本控制软件Gi

2017-09-18 11:32:16 871

转载 JavaScript 标准参考教程(alpha)

英文标题:JavaScript Standards Reference Guide作者:  阮一峰授权方式:创意共享“署名-非商业性使用”许可证重要说明:本书正在持续修改之中,大部分章节都没有写完,正式发布还需要一段时间。所有内容随时可能发生变动。目录导论语法标准库面向对象编程语法专题DOM模型浏览器环境HTML网页的API废稿草稿:jQuery草稿:Node.js导论概述

2017-09-18 08:39:25 714

表格数据导出

表格数据导出。导出文件格式(json、txt、csv、xls、doc)

2018-01-16

ajax图片上传插件

ajax图片上传插件,ajax图片上传插件,ajax图片上传插件,ajax图片上传插件

2018-01-15

日历插件日历插件日历插件

日历插件日历插件日历插件日历插件日历插件日历插件日历插件日历插件

2017-12-28

ckplayer是一款非常好的web网页前台视频播放js插件。

ckplayer是一款非常好的web网页前台视频播放js插件。在web开发中经常都会用到。这款软件提供了很好的demo,并且还提供了植入广告,推广等非常实用的工具。网上也有其使用的大量文章。与之的姊妹插件CKEDITOR也是非常好用的网页前台编辑插件。感谢CK

2017-09-04

lCalendar纯原生js日期时间选择纯原生js日期时间选择

lCalendar纯原生js日期时间选择纯原生js日期时间选择;lCalendar纯原生js日期时间选择纯原生js日期时间选择

2017-09-01

使用HTML、CSS和JavaScript开发Android程序

使用HTML、CSS和JavaScript开发Android程序

2017-08-25

jQuery技术内幕:深入解析jQuery架构设计与实现原理

jQuery技术内幕:深入解析jQuery架构设计与实现原理

2017-08-24

AngularJS权威教程

AngularJS权威教程

2017-08-24

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除