ZhangYang's Blog

发表于 | 分类于

需求

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
let items = $('li')
items.on('click', function(){
  console.log('click')
})
items.addClass('hi').removeClass('error')
items.text('你好')
items.get(0)
1. item 没有 siblings 方法
2. 需求要有 xxx.siblings 方法
3. $item = $(item)   $item.siblings() 返回 item 的兄弟
1. $item.siblings() 没有 addClass 方法
2. 需求要有  $item.siblings().addClass
3. $item.siblings() 的结果是 $('li') 类似的东西
$item.siblings().removeClass('active').end()
  .addClass('active')
阅读全文 »
ZhangYang's Blog

发表于 | 分类于

人生如寄,遇见的只是旅人

2017年过得比任何一年都快,每天都沉浸在代码”柳暗花明又一村”的喜悦中,并很幸运的转到另一种职业规划中

这一年经历有点多,要叙述一个复杂的故事,从简单的时间轴是最好的方法

时间轴

阅读全文 »
ZhangYang's Blog

发表于 | 分类于

算法简介

以下是高德纳在他的著作《计算机程序设计艺术》里对算法的特征归纳：

输入：一个算法必须有零个或以上输入量。

输出：一个算法应有一个或以上输出量，输出量是算法计算的结果。
明确性：算法的描述必须无歧义，以保证算法的实际执行结果是精确地匹配要求或期望，通常要求实际运行结果是确定的。

阅读全文 »
ZhangYang's Blog

发表于 | 分类于

安装使用

  • cdn方式
1
2
3
4
5
6
7
8
<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<!-- popper.min.js 用于弹窗、提示、下拉菜单 -->
<script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
阅读全文 »
ZhangYang's Blog

发表于 | 分类于

AngularJS 简介

指令

  • ng-app 指令告诉 AngularJS，
    元素是 AngularJS 应用程序 的”所有者”
  • ng-model 指令把输入域的值绑定到应用程序变量 name 
1
2
3
4
<div ng-app="">
     <p>名字 : <input type="text" ng-model="name"></p>
     <h1>Hello {{name}}</h1>
</div>
阅读全文 »
ZhangYang's Blog

发表于 | 分类于

ES6的简介

ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准。因为当前版本的ES6是在2015年发布的，所以又称ECMAScript 2015

Babel转码器

Babel 是一个广泛使用的 ES6 转码器，可以将 ES6 代码转为 ES5 代码

阅读全文 »
ZhangYang's Blog

发表于 | 分类于
  • Flex 是 Flexible Box 的缩写，意为”弹性布局”
1
2
3
4
5
6
7
8
9
// 任何一个容器都可以指定为 Flex 布局
.box{
  display: flex;
}
// 行内元素也可以使用 Flex 布局
.box{
  display: inline-flex;
}
阅读全文 »
ZhangYang's Blog

发表于 | 分类于

可以针对不同的媒体类型或不同的屏幕尺寸定义不同的样式，媒体类型，包括PC、平板、手机、打印机、电视、屏幕阅读器

媒体查询的引入

link方法引入

1
2
3
4
<link rel="stylesheet" herf = "responsive.css"  media="mediatype and | not | only (media feature)"></link>
<!-- 举例 -->
<link rel="stylesheet" media="screen and (max-width: 600px)" href="small.css" />
阅读全文 »