陈映平 于 5个月前发表 1340 1 2
入门简介 [http://7tszky.com1.z0.glb.clouddn.com/FoUS9X6GzKkyaciiwN-9V6pHGA0q] Express是基于nodejs的web开发框架。优点是易上手、高性能、扩展性强。 * 易上手 :nodejs最初就是为了开发高性能web服务器而被设计出来的,然而相对底层的API会让不少新手望而却步。express对web开发相关的模块进行了适度的封装,屏蔽了大量复杂繁琐的技术细节,让开发者只需要专注于业务逻辑的开发,极大的降低了入门和学习的成本。 * 高性能 :express仅在web应用相关的nodejs模块上进行了适度的封装和扩展,较大程度避免了过度封装导致的性能损耗。 * 扩展性强 :基于中间件的开发模式,使得express应用的扩展、模块拆分非常简单,既灵活,扩展性又强。 环境准备 首先,需要安装nodejs,这一步请自行解决。接着,安装express的脚手架工具 express-generator ,这对于我们学习express很有帮助。 npm install -g express-generator
5个月前
nodeJS全栈
王军 于 5个月前发表 452 0 0
本文为 H5EDU 机构官方 HTML5培训 AngularJS 通过被称为 指令 的新属性来扩展 HTML。 AngularJS 通过内置的指令来为应用添加功能。 AngularJS 允许你自定义指令。 AngularJS 指令 AngularJS 指令是扩展的 HTML 属性,带有前缀 ng-。 ng-app 指令初始化一个 AngularJS 应用程序。 ng-init 指令初始化应用程序数据。 ng-model 指令把元素值(比如输入域的值)绑定到应用程序。 完整的指令内容可以参阅 AngularJS 参考手册。 AngularJS 实例 在输入框中尝试输入: 姓名:<input type="text" ng-model="firstName"></p你输入的为: {{ firstName }} 教程,主要介绍:JavaScript强化教程 —— AngularJS 指令 ng-app 指令告诉 AngularJS, 元素是 AngularJS 应用程序 的"所有者"。 Note 一个网页可以包含多个运行在不同元素中的 AngularJS 应用程序。 数据绑定 上面实例中的
5个月前
HTML&HTML5
zzbozheng 于 5个月前发表 1113 2 0
原生的HTML5 API fetch并不支持 timeout 属性,习惯了jQuery的ajax配置的同学,如果一时在fetch找不到配置 timeout 的地方,也许会很纠结。fetch 的配置 API 如下: 语法 fetch(input, init).then(function(response) { ... }); 参数 * input 定义要获取的资源。这可能是: 一个 USVString 字符串,包含要获取资源的 URL。 一个 Request 对象。 * init 可选 一个配置项对象,包括所有对请求的设置。可选的参数有: method: 请求使用的方法,如 GET、POST。 headers: 请求的头信息,形式为 Headers 对象或 ByteString。 body: 请求的 body 信息:可能是一个 Blob、BufferSource、FormData、URLSearchParams 或者 USVString 对象。注意 GET 或 HEAD 方法的请求不能包含 body 信息。
5个月前
HTML&HTML5
kurtshen 于 5个月前发表 465 0 0
ES6 SET ES6 新增了几种集合类型,本文主要介绍Set以及其使用。 其基本描述为 Set对象是值的集合,你可以按照插入的顺序迭代它的元素。 Set中的元素只会出现一次,即 Set 中的元素是唯一的。 它的声明 new Set([iterable]); 其中iterable是一个可迭代对象,其中的所有元素都会被加入到 Set 中。null被视作 undefined。也可以不传入[iterable],通过其add方法来添加元素。 对于ruby或者是python比较熟悉的同学可能会比较了解set这个东东。它是ES6 新增的有序列表集合,它不会包含重复项。 SET的属性 * Set.prototype.size:返回Set实例的成员数量。 * Set.prototype.constructor:默认的构造Set函数。 SET方法 * add(value):添加某个值,返回Set结构本身。 * delete(value):删除某个值,返回一个布尔值,表示删除成功。 * has(value):返回一个布尔值,表示参数是否为Set的成员。
5个月前
javascript技术
王军 于 5个月前发表 443 0 0
本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— 数组的基本处理函数 Array.push();添加元素在数组最后,并返回数组新的长度 Array.pop();删除最后一个元素,减小数组长度,并返回最后一个元素 Array.unshift();在数组前面添加元素 Array.splice(n,x); //n数组下标 x删除几个 从n开始删除 (x=1时,表明删除当前下标为n的元素) indexOf() 搜索整个数组中具有给定制的元素,返回找到的第一个元素的索引或者如果没有找到就返回 -1 map()方法将调用的数组的每个元素传递给指定函数,并返回一个数组,它包含该函数的返回值 a= [1,2,3]; b=a.map(function(){ return x*x;}); //b是[1,4,9] 字符数组的基本处理函数 1.substr(x,n) 输出一段字符串,从x向后输出n个 小贴士 类似于splice(x,n); substr(n)从第n个到最后 2.charAt(n)
5个月前
HTML&HTML5
吴浩麟 于 5个月前发表 696 0 0
最近在做组件的过程中遇到滚动到底部需要加载更多的需求,发现每个HTML元素都具有一些容易搞混淆的属性就详细的研究了一番总结下。 每个HTML元素都具有 clientHeight offsetHeight scrollHeight offsetTop scrollTop 这5个和元素高度、滚动、位置相关的属性,单凭单词很难搞清楚分别代表什么意思之间有什么区别。通过阅读它们的文档总结出规律如下: clientHeight 和 offsetHeight 属性和元素的滚动、位置没有关系它代表元素的高度,其中: * clientHeight :包括padding但不包括border、水平滚动条、margin的元素的高度。对于inline的元素这个属性一直是0,单位px,只读元素。[http://7tszky.com1.z0.glb.clouddn.com/FmoyfwVMoVKbeRfuHAghzFPImwr5]
5个月前
HTML&HTML5
何方舟 于 5个月前发表 2917 5 2
REACT + REDUX 组件化方案 在介绍组件化方案之前,先对 react 和 redux 做一个简单介绍。 WHY REACT 理想中的组件化,第一步应该就是组件的标签化, 例如有一个 Header 组件,如下图所示 Alt text [http://7xjduk.com1.z0.glb.clouddn.com/header.png] 无需关注组件内部的实现,我们只需要使用一个 <Header/> 标签就能调用它,通过设置属性的方式,来控制它的显示的内容,和对应的事件。 classPageextendsComponent { render () { <div> <Header onAttend={click} anchorInfo={anchorInfo} members={members}/> </div> } } onAttend 决定点击关注时会触发的事件 anchorInfo 决定左侧展示的主播信息 members 坐定右侧展示的成员信息 借助 jsx 语法,React 已经实现上述想法。
5个月前
javascript技术
王军 于 5个月前发表 373 0 0
本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— 语句 条件语句 通常在写代码时,您总是需要为不同的决定来执行不同的动作。您可以在代码中使用条件语句来完成该任务。 在 JavaScript中,我们可使用以下条件语句: if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码 if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码 if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行 switch 语句 - 使用该语句来选择多个代码块之一来执行 JavaScript Switch 语句 请使用 switch 语句来选择要执行的多个代码块之一。 语法 switch(n) { case 1: 执行代码块 1 break; case 2: 执行代码块 2 break; default: n 与 case 1 和 case 2 不同时执行的代码 } default 关键词 请使用 default 关键词来规定匹配不存在时做的事情:
5个月前
HTML&HTML5
王军 于 5个月前发表 361 0 0
本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— JavaScript运算符 JavaScript算术运算符 算术运算符用于执行两个变量或值的运算。 赋值 y = 5, 以下表格将向你说明算术运算符的使用: 运算符 描述 例子 y 值 x 值 在线实例 * 加法 x = y + 2 y = 5 x = 7 实例 » * 减法 x = y - 2 y = 5 x = 3 实例 » * 乘法 x = y * 2 y = 5 x = 10 实例 » / 除法 x = y / 2 y = 5 x = 2.5 实例 » % 余数 x = y % 2 y = 5 x = 1 实例 » ++ 自增 x = ++y y = 6 x = 6 实例 » x = y++ y = 6 x = 5 实例 » -- 自减 x = --y y = 4 x = 4 实例 » x = y-- y = 4 x = 5 实例 » 关于算术运算符,你可以阅读我们的 JavaScript运算符教程。 JavaScript赋值运算符
5个月前
HTML&HTML5
朱灵子 于 5个月前发表 663 2 0
ES6浅析 Babel 是一个 JavaScript编译器,它可以把我们编写的符合 ECMAScript 6 标准的代码完美地转换为 ECMAScript 5 标准的代码,并且可以确保转换后的语言良好地运行在所有主流 JavaScript引擎中。我们可以把babel简单地理解为 从源代码到源代码的编译器 。 以下是ES6新特性在Babel下的兼容性列表 [http://7tszky.com1.z0.glb.clouddn.com/FotkhQdmSPM7DCq3czho7NWy7oXT] 今天我就使用babel编译器这个强大的工具来理解Es6的一些语法,主要从以下几个方面的对比来进行理解: * Let、const与var * 箭头函数与普通函数 * 原型方法静态方法 -------------------------------------------------------------------------------- LET、CONST与VAR 使用babel编译工具我们发现let const编译以后都变成了var,那他们和var到底有哪些方面的区别呢?
5个月前
javascript技术
王军 于 5个月前发表 511 0 0
本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— 对象在编写时可不使用 window这个前缀。 一些例子: location.hostname 返回 web 主机的域名 location.pathname 返回当前页面的路径和文件名 location.port 返回 web 主机的端口 (80 或 443) location.protocol 返回所使用的 web 协议(http:// 或 https://) Href location.href 属性返回当前页面的 URL。 实例 返回(当前页面的)整个 URL:[removed] (location.href); [removed]以上代码输出为: http://www.w3school.com.cn/js/ [http://www.w3school.com.cn/js/] ... indow Location Pathname location.pathname 属性返回 URL 的路径名。 实例
5个月前
HTML&HTML5
王军 于 5个月前发表 477 0 0
本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 —— sort() 方法 实例 数组排序:var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.sort();fruits 输出结果:Apple,Banana,Mango,Orange 定义和用法 sort() 方法用于对数组的元素进行排序。 排序顺序可以是字母或数字,并按升序或降序。 默认排序顺序为按字母升序。 注意:当数字是按字母顺序排列时"40"将排在"5"前面。 使用数字排序,你必须通过一个函数作为参数来调用。 函数指定数字是按照升序还是降序排列。 这些说起来可能很难理解,你可以通过本页底部实例进一步了解它。 注意: 这种方法会改变原始数组!。 array.sort(sortfunction)参数 Values 参数 描述 sortfunction 可选。规定排序顺序。必须是函数。 返回值 Type 描述 Array 对数组的引用。请注意,数组在原数组上进行排序,不生成副本。
5个月前
HTML&HTML5