- 博客(189)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 mac终端下安装brew命令
mac 终端下安装brew命令：/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"在终端环境下，brew --version 查看brew的版本，也可以验证brew是否安装成功...
2019-12-24 21:45:33
937
原创 vue实现数据双向绑定的基础之理解对象属性类型
原生JavaScript之理解对象ECMA-262 把对象定义为：“无序属性的集合，其属性可以包含基本值、对象或者函数。”严格来讲，这就相当于说对象是一组没有特定顺序的值。对象的每个属性或方法都有一个名字，而每个名字都映射到一个值。正因为这样（以及其他将要讨论的原因），我们可以把ECMAScript 的对象想象成散列表：无非就是一组名值对，其中值可以是数据或函数。每个对象都是基于一个...
2019-10-29 10:25:51
744
原创 ajax原理实战
创建一个learnDemo首先 先开启一个小型服务器node.js环境下执行：http-server创建：ajax.html. <!DOCTYPE html><html><head> <title>ajax</title> <script type="text/javascript">
2018-04-01 16:59:39
369
原创 javaScript继承模式 导图
思维导图地址预览如图：参考：JavaScript高级程序设计 原型链继承模式借用构造函数继承模式组合继承模式原型式继承模式寄生继承模式寄生组合继承模式...
2018-03-31 16:25:04
360
原创 组合继承第6.3.3讲为什么修复构造函数指向
function SuperType(name){ this.name = name; this.colors = ["red", "blue", "green"]; } SuperType.prototype.sayName = function(){ alert(this.name); }; function SubType(name, age){ //继承属性...
2018-03-29 16:54:51
1415
1
原创 vuex实战笔记
Vuex 是什么？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。首先 用Vue脚手架工具构建好一个项目，在控制命令行中输入下边的命令下载一个vue webpack模版 启动项目 看到这个界面，接着着手使用vuex，为了便于vuex例子更快实现，删掉 ...
2018-03-26 11:28:03
543
原创 数据逻辑与UI的结合
应用程序等于用户界面加底层数据，一个有用的软件，它的本质是 数据处理要探讨底层数据与UI的结合，开发一个完整的程序，还得应对很多数据结构，例如jSON对象，数组等，通过一个具体事例，看看在React框架下，数据是如何 与用户界面耦合起来的。var destination = document.querySelector("#container");var Circle = React.creat...
2018-03-19 17:37:41
689
原创 react组件的生命周期
应对生命周期的是组件的生命周期函数，在组件从创建，加载，到最后删除的这段周期里，不同的时间点，React 框架都会调用组件的不同的生命周期函数。这些函数被调用时，本质上是框架在传达信息，它告诉我们，组件当前正在处于某个特殊的时间点上。生命周期函数就是组件本身具备的一些被框架在适当时间调用的固定接口而已，先看几个比较重要的几个周期函数：1，componentWillMount 2，component...
2018-03-18 23:16:43
380
原创 react响应和处理事件
React 使用最多的，是设计应用的设计UI,而用户界面一个最重要的目的是以有效的方式响应用户输入。用户输入多种多样，有鼠标点击，有键盘按键，有窗口大小的更改，如果运行在手机上的话，还得响应拖拽等手势操作。应对这些复杂的情形的办法是抽象，把用户的任何操作都当做一种事件，如果你了解原来的web开发的话，那么你一定知道，很多开发的精力都要放在响应DOM事件的处理之上。做一个简单的程序（把页面显示给用户...
2018-03-17 18:24:40
1544
原创 组建的状态机制
应用程序必须运用在一个“活”的情景中，由于组件是程序的基本组成单位，它必须得主动应对不断变化的场景。它必须能够和用户互动，对用户的输入做出响应。所以我们需要一种能够给组件注入“生命”的机制，让组件灵活应对具体场景中的不同变化，由此我们需要一种除了属性之外的数据存储机制，这种机制能够使得所存储的数据根据需要不断变化，同时 ，一旦数据变化后，组件根据数据的变动做相应的反应，便把反应 呈现到界面，这种机...
2018-03-17 15:26:41
328
原创 JSX深入详解
JSX是一种类似于html标签组合的语法对象，JSX实例如下：var Card = React.createClass({ render: function() { return ( <div> <Square color={this.props.color}/> ...
2018-03-16 23:23:00
494
原创 react导言
1， 自动化的UI 状态管理 2， 快速的DOM 操作 3， 创建可重用的UI组件 4， UI 的纯JS 开发 5， React 是MVC 模式中的V这几点是React 设计的基本原则和应用特色，是React 在众多开发 框架中脱颖而出的主要原因。在开发过程，会接触以下⼏几点知识：1， 项目中会引入JSX，React程序的重要概念。 2， 搭建起React应用的基本框架 3， 如何依赖React ...
2018-03-16 13:58:57
194
原创 react开发基本概念
1， 老式的多页网络应用今日，各种丰富精巧的网络应用层出不穷，甚至把各种功能和界面异常复杂的桌面应用都套到了了Web里，像微软现金奶牛的Office套件，是多么复杂的一种桌面应用程序，它的代码量量跟windows操作系统几乎不不相上下，这种庞然大物居然能装到Web里里面，可见近几年来Web技术的发展可谓突飞猛进。如果没有像React 这种强大的技术框架支持，要开发这种网页应用根本就是不不可想象的。...
2018-03-16 13:57:40
319
原创 构建第一个react应用
基本的环境准备 我们开发的是web APP应用，所以我们至少需要个Http服务器。首先nodejs环境下 执行 http.server 这样，一个小型http服务器就可以启动了，我们可以通过浏览器， 访问该目录下所有文件，我们的代码将存储在该目录。在该录下新建个文件，叫做index.html,这个文件将是我们 源代码的编写文件首先第1步，我们先编写整个app的⻣架：<!DOCTYPE ht...
2018-03-16 13:57:28
218
原创 构造复合型组件
上篇文章中，已使用组件技术，实现了一个“五彩冰粉”的网页控件。 从中可以体会到，组件其实就是把html, javascript, 和css 以有机的方式结合在一起，形成一个高度可重用的独立单元本篇文章中，将研究组件的另一特性，就是它的组合性，React组件 技术的一大杀伤力在于，它能让我们通过把微小简单的组件结合起来，进而创造出复杂强大的复合组件，把控件分解成 若干个简单的控件，然后把这些简单小控...
2018-03-15 22:17:21
325
原创 react组件化设计
1，组件是React 开发框架中，最重要的设计概念。这也是React能够 帮助我们简单容易的开发复杂用户界面的有效利器。假定我们最终开发的网页应用如图所示，它的界面右1系列复杂的 控件元素组合而成。原有的设计思想是，把这些复杂的控件组合当做一个单一整体来开发，由于控件间需要相互通讯，因此不同组件间 耦合度很多，开发1个控件时，你需要考虑这个控件与其他控件的 相互联系，这样一来设计思路会变得非常复杂...
2018-03-15 21:19:52
3699
原创 React 界面样式设计
当我们完成程序的基本功能后，不对程序界面进行打磨妆点，那么过于素颜的界面，对用户是产生不了吸引力的。对于网页应用而言，用来美化界面的技术，一直都是CSS,CSS是一种好技术，它能将界面的美化和程序的功能逻辑进行良好的分离。特别是它的选择子功能，能够让开发者针对某个具体控件进行美化。然而在React 框架下，我们不好继续使用CSS来设计界面，这是由 React的设计思想所决定的。React的核新思想...
2018-03-15 21:18:02
2968
原创 git保存用户名密码的方法
方法一：编辑本地 .git/config 增加[credential] helper = store保存，第一次需要输入用户名密码，输入一次密码后第二次就会记住密码了不会再提示输入用户名及密码方法二：1. Windows中添加一个HOME环
2017-01-17 16:30:56
4679
原创 滑动会卡 bug解决
-webkit-overflow-scrolling 用来控制元素在移动设备上是否使用滚动回弹效果.兼容安卓和IOS的写法如下overflow:auto;/* winphone8和android4+ */ -webkit-overflow-scrolling: touch; /* ios5+ */ 取值auto使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。
2017-01-10 17:53:13
713
翻译 用grunt搭建自动化的web前端开发环境-完整教程
jQuery在使用grunt，bootstrap在使用grunt，百度UEditor在使用grunt，你没有理由不学、不用！1. 前言各位web前端开发人员，如果你现在还不知道grunt或者听说过、但是不会熟练使用grunt，那你就真的真的真的out了（三个“真的”重复，表 示重点）。至于grunt的作用，这里不详细说了，总之你如果做web前端开发，你一定要用grunt。还有一点，
2016-06-14 17:10:18
1494
原创 JavaScript杂谈
引子 编程世界里只存在两种基本元素，一个是数据，一个是代码。编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力。 数据天生就是文静的，总想保持自己固有的本色；而代码却天生活泼，总想改变这个世界。 你看，数据代码间的关系与物质能量间的关系有着惊人的相似。数据也是有惯性的，如果没有代码来施加外力，她总保持自己原来的状态。而代码就象能量，他存在的唯一目的，就
2016-02-14 18:02:11
644
原创 AngularJS展示数据的ng-bind指令和{{}} 区别
在AngularJS中显示模型中的数据有两种方式：一种是使用花括号插值的方式：1p>{{text}}p>另一种是使用基于属性的指令，叫做ng-bind：1png-bind="text">p>这两种方式的效果都是一样的，其主要区别在于，使用花括号语法时，在Angul
2016-01-23 16:03:41
2540
原创 CSS 注意事项
1 . ID属性不要以数字开头，数字开头的ID在 Mozilla/Firefox 浏览器中不起作用。 2 . 类名的第一个字符不能使用数字！它无法在 Mozilla 或 Firefox 中起作用。CSS 布局特点 对于蜘蛛在爬行一个网站的页面时，若是有太多的垃圾代码，会使搜索蜘蛛对其产生不友好、不信任感，同时蜘蛛的爬行速度
2016-01-15 13:27:52
677
原创 JavaScript调试技巧之console.log()详解
对于JavaScript程序的调试，相比于alert()，使用console.log()是一种更好的方式，原因在于：alert()函数会阻断JavaScript程序的执行，从而造成副作用；而console.log()仅在控制台中打印相关信息，因此不会造成类似的顾虑。 一、什么是console.log()？除了一些很老版本的浏览器，现今大多数浏览器都自带调试功能；即使
2016-01-06 11:32:29
3178
转载 AngularJS Bootstrap
你可以在你的 AngularJS 应用中加入 Twitter Bootstrap，你可以在你的 元素中添加如下代码:如果站点在国内，建议使用百度静态资源库的Bootstrap，代码如下：以下是一个完整的 HTML 实例, 使用了 AngularJS 指令和 Bootstrap 类。HTML 代码!DOCTYPE htm
2016-01-04 16:47:13
902
转载 AngularJS API
API 意为 Application Programming Interface（应用程序编程接口）。AngularJS 全局 APIAngularJS 全局 API 用于执行常见任务的 JavaScript 函数集合，如：比较对象迭代对象转换对象全局 API 函数使用 angular 对象进行访问。以下列出了一些通用的 API 函数：
2016-01-04 16:35:28
502
转载 AngularJS 输入验证
AngularJS 表单和控件可以验证输入的数据。输入验证在前面的几个章节中，你已经学到关于 AngularJS 表单和控件的知识。AngularJS 表单和控件可以提供验证功能，并对用户输入的非法数据进行警告。客户端的验证不能确保用户输入数据的安全，所以服务端的数据验证也是必须的。应用代码!DOCTY
2016-01-04 16:00:53
1783
转载 AngularJS 表单
AngularJS 表单是输入控件的集合。HTML 控件以下 HTML input 元素被称为 HTML 控件:input 元素select 元素button 元素textarea 元素HTML 表单HTML 表单通常与 HTML 控件同时存在。AngularJS 表单实例First Name:Last Nam
2016-01-04 15:40:40
445
转载 AngularJS 模块
模块定义了一个应用程序。模块是应用程序中不同部分的容器。模块是应用控制器的容器。控制器通常属于一个模块。带有控制器的模块应用("myApp") 带有控制器 ("myCtrl"):AngularJS 实例!DOCTYPE html>html>script src="http://apps.bdimg.com/libs/angul
2016-01-04 15:36:07
501
转载 AngularJS 事件
AngularJS 有自己的 HTML 事件指令。ng-click 指令ng-click 指令定义了 AngularJS 点击事件。AngularJS 实例div ng-app="" ng-controller="myCtrl">button ng-click="count = count + 1">点我！/button>p>{{ c
2016-01-04 15:25:41
605
转载 AngularJS HTML DOM
AngularJS 为 HTML DOM 元素的属性提供了绑定应用数据的指令。ng-disabled 指令ng-disabled 指令直接绑定应用程序数据到 HTML 的 disabled 属性。AngularJS 实例div ng-app="">p>button ng-disabled="mySwitch">点我！/button>/p>
2016-01-04 15:10:35
532
转载 AngularJS SQL
使用 PHP 从 MySQL 中获取数据AngularJS 实例div ng-app="myApp" ng-controller="customersCtrl"> table> tr ng-repeat="x in names"> td>{{ x.Name }}/td> td>{{ x.Country }}/td> /tr>
2016-01-04 13:58:14
603
转载 AngularJS 表格
ng-repeat 指令可以完美的显示表格。在表格中显示数据使用 angular 显示表格是非常简单的：AngularJS 实例div ng-app="myApp" ng-controller="customersCtrl"> table> tr ng-repeat="x in names"> td>{{ x.Name }}/
2016-01-04 13:34:27
1136
转载 AngularJS XMLHttpRequest
$http 是 AngularJS 中的一个核心服务，用于读取远程服务器的数据。读取 JSON 文件以下是存储在web服务器上的 JSON 文件：http://www.runoob.com/try/angularjs/data/Customers_JSON.php{"records":[{"Name" : "Alfreds Futterkis
2016-01-04 13:22:26
1333
转载 AngularJS Filters
过滤器可以使用一个管道字符（|）添加到表达式和指令中。AngularJS 过滤器AngularJS 过滤器可用于转换数据：过滤器描述currency格式化数字为货币格式。filter从数组项中选择一个子集。lowercase格式化字符串为小写。orderBy
2016-01-04 13:03:51
463
转载 AngularJS 指令
AngularJS 通过被称为 指令 的新属性来扩展 HTML。AngularJS 指令AngularJS 指令是扩展的 HTML 属性，带有前缀 ng-。ng-app 指令初始化一个 AngularJS 应用程序。ng-init 指令初始化应用程序数据。ng-model 指令把元素值（比如输入域的值）绑定到应用程序。AngularJS 实例
2016-01-04 11:44:46
597
转载 AngularJS 表达式
AngularJS 使用 表达式 把数据绑定到 HTML。AngularJS 表达式AngularJS 表达式写在双大括号内：{{ expression }}。AngularJS 表达式把数据绑定到 HTML，这与 ng-bind 指令有异曲同工之妙。AngularJS 将在表达式书写的位置"输出"数据。AngularJS 表达式 很像 JavaScri
2016-01-04 11:41:51
1017
转载 AngularJS简介
AngularJS 是一个 JavaScript 框架。它可通过 标签添加到 HTML 页面。AngularJS 通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML。AngularJS 是一个 JavaScript 框架AngularJS 是一个 JavaScript 框架。它是一个以 JavaScript 编写的库。AngularJS 是
2016-01-04 11:35:48
465
原创 HTML5 简介
HTML5 是下一代 HTML 标准。HTML5 简单易学。HTML5新元素新属性完全支持 CSS3Video 和 Audio2D/3D 制图本地存储本地 SQL 数据Web 应用HTML5 多媒体使用 HTML5 你可以简单的在网页中播放 视频(video)与音频 (audio) 。HTML5 H
2015-12-31 16:31:02
524
高清版HTML5与CSS3权威指南上册
2019-01-28
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人