小知识

github pages

在setting里面有github pages这一栏,选择分支,就会出现链接

移动端rem适配(http://www.cnblogs.com/zhangwenkan/p/5775357.html)

原理:给html根节点设置一个基础font-size值,然后页面的所有元素布局均相对于该font-size值采用rem单位设定。font-size的取值通过js计算。

但字体不用rem单位,原因如下:

1.设计师要求:任何手机屏幕上字体大小都要统一

2.显然,我们在iPhone3G和iPhone4的Retina屏下面,希望看到的文本字号是相同的。也就是说,我们不希望文本在Retina屏幕下变小,另外,我们希望在大屏手机上看到更多文本,以及,现在绝大多数的字体文件都自带一些点阵尺寸,通常是16px和24px,所以我们不希望出现13px和15px这样的奇葩尺寸。

3.有一种叫做点阵字体的存在(什么是点阵字体),也叫作位图字体,位图我们都知道,跟矢量图是有区别的,就是放大会模糊,所以点阵字体也是放大会模糊的,如果根据rem设置字体大小,字体会自由缩放,可能就会导致点阵字体模糊,所以需要设定使用几种固定大小的字体。(不过,在正常情况下,系统自带的字体都是矢量字体,所以使用rem为单位是没有问题的,除非你的网页需要用到特殊的点阵字体。)

angularjs 关于src和ng-src的区别,ng-src="{{}}"里面为什么要用中括号?

简单的说:
1、资源url是个常量,那么就用src,没毛病;
2、资源url是个(包含)变量,那么就用ng-src + {{}},可以规避第一次请求404的问题。

href="#"与href="javascript:void(0)"的区别

“#” 包含了一个位置信息,默认的锚是#top 也就是网页的上端。
而javascript:void(0), 仅仅表示一个死链接。
在页面很长的时候会使用 # 来定位页面的具体位置,格式为:# + id。
如果你要定义一个死链接请使用 javascript:void(0) 。

自执行函数(不污染全局)

(function(window){})(window)

window.location对象

监听网址的变化

  (function(window) {
  window.addEventListener('hashchange', function(e) {
    var hash = window.location.hash;
    switch (hash) {
      case '#/index/':
        console.log('请求index');
        break;
      case '#/demo/':
        console.log('demo');
        break;
      case '#/aaa/':
        console.log('aaa');
        break;
    }
    // console.log(11111);
    // console.log(e);
    // hash 属于路径(URL)的组成
    // console.log(window.location);
    // 可以通过 window.location 拿到所有信息
    // https://www.baidu.com:8080/aaa/1.html?id=10#name
    //
    // protocol: https
    // host: www.baidu.com:8080
    // hostname: www.baidu.com
    // port: 8080
    // pathname: /aaa/1.html
    // search: ?id=10
    // hash: #name
  });
})(window);

通过自定义指令访问DOM: 对于Angular,一个程序中唯一允许接触DOM的地方就是“指令”。之所以这样要求,是因为需要访问DOM的代码难以进行自动化测试。 如果你需要直接访问DOM,那么你就应该为此写一个自定义指令。在 指令指南一章中详细解释了该怎样实现自定义指令。

angular指令 用驼峰命名法

建议使用破折号分隔符的方式(比如ng-bind for ngBind). 如果你想支持HTML验证工具,你可以加前缀data.(比如把ngBind写成data-ng-bind).
自定义指令时尽量返回一个对象,而不要只返回一个函数

创建一个能由元素名字触发的指令,你需要用到restrict选项
选项restrict可以设置成以下方式:
'A' - 仅匹配属性名
'E' - 仅匹配元素名
'AE' - 既匹配属性名又匹配元素名
下面把例子的restrict选项选项成restrict: 'E'。

创建一个操作DOM的指令

在这个例子中,我们会创建一个显示当前时间的指令,每秒一次更新DOM以正确的显示当前的时间。
指令修改DOM通常是在link选项中,link选项接受一个带有如下签名的函数function link(scope,element,attrs) {...} 其中: scope 是一个Angular的scope对象. element 指令匹配的jqLite封装的元素(angular内部实现的类jquery的库) * attrs 是一个带有规范化后属性名字和相应值的对象.
在我们的link 函数中,我们每秒更新一次显示时间,当用户改变绑定的时间格式字符串的时候也会更新。 当指令被删除的时候,我们也要移除定时器,以避免引入内存泄露。

我该什么时候使用$location?

只要你的应用想更改当前地址,或者你想要修改浏览器的当前地址,就用它吧!

什么时候不该用它?

在浏览器地址变化的时候,它不会导致全页面刷新。要想在地址变化之后重载整个页面,请使用底层API$window.location.href。

ng-bind-html

ng-bind-html需要引入一个解析HTML的插件

1 采用ngSanitize插件的形式解析HTML

1.1 在angularJS的库文件中可以找到

1.2 也可以到bootcdn上面去下载使用

当你初试 Angular 时,很自然地就会往 controller 和 scope 里堆满不必要的逻辑。一定要早点意识到,controller 这一层应该很薄;也就是说,应用里大部分的业务逻辑和持久化数据都应该放在 service 里。很多人问道,关于如何在 controller 里保存持久化数据。这就不是 controller 该干的事。出于内存性能的考虑,controller 只在需要的时候才会初始化,一旦不需要就会被抛弃。因此,每次当你切换或刷新页面的时候,Angular 会清空当前的 controller。与此同时,service 可以用来永久保存应用的数据,并且这些数据可以在不同的 controller 之间使用。

推荐阅读更多精彩内容

  • AngularJS是什么?AngularJs(后面就简称ng了)是一个用于设计动态web应用的结构框架。首先,它是...
    200813阅读 1,090评论 0 3
  • 对web标准以及W3C的理解与认识 web标准,简单来说就是将页面的结构、表现和行为各自独立实现(结构、表现和行为...
    饥人谷区子铭阅读 219评论 0 1
  • 前端7班_leec 浏览器的标准模式与怪异模式 在W3C标准出台以前,浏览器在对页面的渲染上没有统一规范,产生了差...
    奔跑的Pi阅读 111评论 0 1
  • 大的网站将css放在head里面是为了防止散屏、白屏,内容出来样式摆出来 index.html约定俗成的文件名,访...
    findmoon阅读 144评论 0 0
  • 一:box-sizing 1:box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。 2:默认值...
    stars甜阅读 61评论 0 2