angular学习笔记(六)-非入侵式javascript

这篇主要讲解非入侵式javascript.

在传统的前端开发中,把js写在html中,称为入侵式的javascript:

<span id="select_area" onclick="..." </span>

这种做法由于没有把视图和行为分离,而且不易于维护管理,所以已经被淘汰掉.

但是,angular通过改进,很好的解决了这个问题.称为声明式事件处理器.

<!DOCTYPE html>
<html ng-app>
<head><title>3.1.非入侵式js</title><meta charset="utf-8"><script src="../angular.js"></script><script src="script.js"></script>
</head>
<body><div class="navBar" ng-controller="NavController"><span ng-click="doSome()">A</span></div><div class="content" ng-controller="ContentController"><span ng-click="doSome()">B</span></div>
</body>
</html>

页面中的两个span元素都绑定了点击事件回调:doSome()

使用angular的声明式事件处理器,可以兼容所有的浏览器,并且不会再全局命名空间中进行操作.

比如这里的doSome函数,他们都是在各自的作用域下的函数,作用域取决于元素所在的控制器:

function NavController($scope) {$scope.doSome = function(){alert('a')};
}
function ContentController($scope) {$scope.doSome = function(){alert('b')};
}

所以,angular的事件处理器,看似使用了入侵式的javascript,但其实,它有很好的可读性,简单性,可扩展性.

angular学习笔记(六)-非入侵式javascript相关推荐

Java学习笔记六、面向对象编程中级部分
Java学习笔记六.面向对象编程中级部分包包的注意事项和使用细节访问修饰符访问修饰符的注意事项和使用细节面向对象编程三大特征封装封装的实现步骤(三步) 继承继承的细节问题继承的本质 ...
JS学习笔记六：js中的DOM操作
1. JS学习笔记六:js中的DOM操作文章目录 1. JS学习笔记六:js中的DOM操作 1.1. 获取Dom节点 1.2. 元素属性的操作方式 1.3. DOM节点的创建.插入和删除 1.4. ...
Polyworks脚本开发学习笔记(六)-比较运算、数学运算、逻辑运算及流程控制
Polyworks脚本开发学习笔记(六)-比较运算.数学运算.逻辑运算及流程控制前言比较运算.逻辑运算及流程控制是编程的基本语法,Polyworks的语法规则与VB/C#/Python等并没有很大 ...
Ethernet/IP 学习笔记六
Ethernet/IP 学习笔记六 EtherNet/IP defines two primary types of communications: explicit and implicit (Ta ...
吴恩达《机器学习》学习笔记六——过拟合与正则化
吴恩达<机器学习>学习笔记六--过拟合与正则化一. 过拟合问题 1.线性回归过拟合问题 2.逻辑回归过拟合问题 3.过拟合的解决二. 正则化后的代价函数 1.正则化思想 2.实际使用的 ...
ROS学习笔记六：理解ROS服务和参数
ROS学习笔记六:理解ROS服务和参数主要介绍ROS服务和参数,同时使用命令行工具rosservice和rosparam. ROS service service是节点之间互相通信的另一种方式,se ...
opencv 手选roi区域_【opencv学习笔记六】图像的ROI区域选择与复制
图像的数据量还是比较大的,对整张图片进行处理会影响我们的处理效率,因此常常只对图像中我们需要的部分进行处理,也就是感兴趣区域ROI.今天我们来看一下如何设置图像的感兴趣区域ROI.以及对ROI区域图像 ...
Python学习笔记六——画小猪佩奇
目录 Python学习笔记六--画小猪佩奇画布画笔属性设置操纵命令运动命令画笔控制命令全局控制命令其他命令 Python学习笔记六--画小猪佩奇使用Python的turtle库可以绘 ...
Learning ROS for Robotics Programming Second Edition学习笔记(六) indigo xtion pro live
中文译著已经出版,详情请参考:http://blog.csdn.net/ZhangRelay/article/category/6506865 Learning ROS for Robotics Pr ...

angular学习笔记(六)-非入侵式javascript

angular学习笔记(六)-非入侵式javascript相关推荐

最新文章

热门文章