Welcome

首页 / 脚本样式 / JavaScript

AngularJS入门教程之XHR和依赖注入详解

2017-02-06 20
到现在为止，我们使用是硬编码的三条手机记录数据集。现在我们使用AngularJS一个内置服务$http来获取一个更大的手机记录数据集。我们将使用AngularJS的依赖注入（dependency injection （DI））功能来为PhoneListCtrl控制器提供这个AngularJS服务。请重置工作目录：git checkout -f step-5刷新浏览器，你现在应该能看到一个20部手机的列表。步骤4和步骤5之间最重要的不同在下面列出。你可以在G...

AngularJS之依赖注入模拟实现

2017-02-06 19
一、概述AngularJS有一经典之处就是依赖注入，对于什么是依赖注入，熟悉spring的同学应该都非常了解了，但，对于前端而言，还是比较新颖的。依赖注入，简而言之，就是解除硬编码，达到解偶的目的。下面，我们看看AngularJS中常用的实现方式。方法一：推断式注入声明，假定参数名称就是依赖的名称。因此，它会在内部调用函数对象的toString（）方法，分析并提取出函数参数列表，然后通过$injector将这些参数注入进对象实例。如下：//方法一：推断式注...

AngularJS入门教程之链接与图片模板详解

2017-02-06 17
这一步，你会为手机列表的手机添加缩略图以及一些链接，不过这些链接还不会起作用。接下来你会使用这些链接来分类显示手机的额外信息。请重置工作目录：git checkout -f step-6现在你应该能够看到列表里面手机的图片和链接了。步骤5和步骤6之间最重要的不同在下面列出。你可以在GitHub里看到完整的差别。数据注意到现在phones.json文件包含了唯一标识符和每一部手机的图像链接。这些url现在指向app/img/phones/目录。app/pho...

AngularJS入门教程之路由与多视图详解

2017-02-06 17
在这一步，你将学习如何创建一个布局模板并且通过路由功能来构建一个具有多个视图的应用。请重置工作目录：git checkout -f step-7注意到现在当你转到app/index.html时，你会被重定向到app/index.html#/phones并且相同的手机列表在浏览器中显示了出来。当你点击一个手机链接时，一个手机详细信息列表也被显示了出来。步骤6和步骤7之间最重要的不同在下面列出。你可以在GitHub里看到完整的差别。多视图，路由和布局模板我们的...

js 获取当前web应用的上下文路径实现方法

2017-02-06 19
js 获取当前web应用的上下文路径实现方法//js webcontextvar webroot=document.location.href;webroot=webroot.substring（webroot.indexOf（"//"）+2,webroot.length）; webroot=webroot.substring（webroot.indexOf（"/"）+1,webroot.length）;webroot=webroot.substring（...

JS获取当前使用的浏览器名字以及版本号实现方法

2017-02-06 19
工作中需要通过JS去获取当前使用的浏览器的名字以及版本号，网上大堆资料都有一个关键词是 navigator.appName，但是这个方法获取的浏览器的名字只有两种要么是IE要么就是Netscap，倒是可以用来判断是否使用了IE，但是我想获取具体的浏览器产品名字比如 Firefox，Chrome等。所以只好通过navigator.userAgent，但是这个字符串是非常长的，分析他的特征，通过正则表达式来解决这个问题是不错的方法。（1） 获取浏览器名字+版本...

AngularJS应用开发思维之依赖注入3

2017-02-06 18
找不到的API？AngularJS提供了一些功能的封装，但是当你试图通过全局对象angular去 访问这些功能时，却发现与以往遇到的库大不相同。$http比如，在jQuery中，我们知道它的API通过一个全局对象：$ 暴露出来，当你需要 进行ajax调用时，使用$.ajax（）就可以了。这样的API很符合思维的预期。AngularJS也暴露了一个全局对象：angular，也对ajax调用进行封装提供了一个 $http对象，但是，但是，当你试图沿用旧经验访问...

JS获取当前页面名称的简单实例

2017-02-06 20
JS获取当前页面名称的简单实例// 取当前页面名称（不带后缀名）function pageName（）{var a = location.href;var b = a.split（"/"）;var c = b.slice（b.length-1, b.length）.toString（String）.split（"."）;return c.slice（0, 1）;} //取当前页面名称（带后缀名）function pageName（） { var strUr...

详解Angular中$cacheFactory缓存的使用

2017-02-06 19
最近在学习使用angular,慢慢从jquery ui转型到用ng开发，发现了很多不同点，继续学习吧； 首先创建一个服务，以便在项目中的controller中引用，服务有几种存在形式，factory（）;service（）;constant（）;value（）;provider（）;其中provider是最基础的，其他服务都是基于这个写的，具体区别这里就不展开了，大家可以看看源码；服务是各个controller之间通话的重要形式，在实际项目中会用的很多，...

AngularJS入门教程之更多模板详解

2017-02-06 19
在这一步，你将实现手机详细信息视图，这个视图会在用户点击手机列表中的一部手机时被显示出来。请重置工作目录：git checkout -f step-8现在当你点击列表中的一部手机之后，这部手机的详细信息页面就会被显示出来。为了实现手机详细信息视图我们将会使用$http来获取数据，同时我们也要增添一个phone-detail.html视图模板。步骤7和步骤8之间最重要的不同在下面列出。你可以在GitHub里看到完整的差别。数据除了phones.json，ap...

Angular中$cacheFactory的作用和用法实例详解

2017-02-06 18
先说下缓存：一个缓存就是一个组件，它可以透明地储存数据，以便以后可以更快地服务于请求。多次重复地获取资源可能会导致数据重复，消耗时间。因此缓存适用于变化性不大的一些数据，缓存能够服务的请求越多，整体系统性能就能提升越多。$cacheFactory介绍：$cacheFactory是一个为Angular服务生产缓存对象的服务。要创建一个缓存对象，可以使用$cacheFactory通过一个ID和capacity。其中，ID是一个缓存对象的名称，capacity则...

jQuery中实现prop（）函数控制多选框（全选,反选）

2017-02-06 16
今天看了jQuery手册，对prop（）函数又多了一点认识，记忆力不好，记录下来。prop（） : 获取匹配元素集中第一个元素的值判断checkbox中的第一个是否被选中：$（":checkbox"）.prop（"checked"）; //如果第一个checkbox被选中返回true,否则返回false.禁用和选中页面上的所有复选框：$（"input[type="checkbox"]"）.prop（"disabled", true）;$（"input[ty...

javascript设计模式Constructor（构造器）模式

2017-02-06 18
Constructor是一种在内存已分配给该对象的情况下，用于初始化新创建对象的特殊方法。Object构造器用于创建特定类型的对象–准备好对象以备使用，同事接收构造器可以使用参数，以在第一次创建对象时，设置成员属性和方法值。对象创建 创新新对象，在javascript中通常有两种方法：1.对象直面量方法 var newObj = {};2.构造器的简洁方法 var newObj = new Object（）; 在Object构造器为特定的值创建对象封装，或...

浅谈js中test（）函数在正则中的使用

2017-02-06 18
test（） 方法用于检测一个字符串是否匹配某个模式.返回一个 Boolean 值，它指出在被查找的字符串中是否匹配给出的正则表达式。regexp.test（str）参数regexp 必选项。包含正则表达式模式或可用标志的正则表达式对象。str 必选项。要在其上测试查找的字符串。说明 test 方法检查字符串是否与给出的正则表达式模式相匹配，如果是则返回 true，否则就返回 false。每个正则表达式都有一个 lastIndex 属性，用于记录上一次匹配...

jQuery搜索框效果实现代码（百度关键词联想）

2017-02-06 20
可以实现关键词联想的，搜索框；集合了百度，谷歌，搜狗，360，腾讯等多家搜索search.html的代码：<！doctype html><html><head><title>搜索框例子</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script type="text/jav...

JS提示：Uncaught SyntaxError:Unexpected token ） 错误的解决方法

2017-02-06 18
本文实例讲述了JS提示：Uncaught SyntaxError:Unexpected token ） 错误的解决方法。分享给大家供大家参考，具体如下：Uncaught SyntaxError: Unexpected token ）以下代码引发了此异常：<div class="Hd_live_Sharediv left"><a href="javascript:void（）" onclick="loadLivePlayer（"ud"）" ...

JS获取checkbox的个数简单实例

2017-02-06 21
JS获取多选框checkbox被选中的个数。var checkbox = document.getElementsByName（"likes[]"）; //此处通过此种方式才能获得多选框为数组。//like为name = "like[]" , 获得时必须加上[]var checked_counts = 0;for（var i=0;i<checkbox.length;i++）{if（checkbox[i].checked）{ //被选中的checkbo...

基于WebUploader的文件上传js插件

2017-02-06 20
首先把地址甩出来，http://fex-team.github.io/webuploader/里面有比较完整的demo案例文档，本文主要是基于文件上传和图片上传增加了大量的注释，基本保证了每行代码都有注释以助于理解，是对官网demo的增强版，希望可以帮助大家更好的理解该插件首先是文件上传jQuery（function（） {var $ = jQuery,$list = $（"#thelist"）,$btn = $（"#ctlBtn"）,state = "p...

js仿腾讯QQ的web登陆界面

2017-02-06 18
用了腾讯QQ也有将近十年了，今天心血来潮想模仿腾讯QQ的登陆面板做一个web版的登陆面板，然后参考了一些代码，自己模仿，学写了一个。效果如下：其中还实现了拖动面板，选择状态的效果下面是具体代码：1.index.html<！DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><title>拖动</title><link h...

Angular设置title信息解决SEO方面存在问题

2017-02-06 18
Javascript框架在处理seo方面存在问题，因为爬虫在检索seo信息的时候会读不了js给其赋的值，导致搜索引擎收录不了或者收录了无效的信息,比如收录的可能是title={{title}}这样的，下面先说如何在路由跳转时修改页面的seo信息，现在spa跳转一般用route-ui了，就以这个为基础讲解，在app.js配置项state中加入title信息，如下：data:{ pageTitle:"user title"}.state（"index.user...
<< 131 132 133 134 135 136 137 138 139 140 >>
版权所有©石家庄振强科技有限公司2024 冀ICP备08103738号-5 网站地图