<!DOCTYPE html>
<html lang="zh-cn" ng-app="HideAnkSeek">
<head>
<meta charset="UTF-8">
<title>躲猫猫</title>
<style type="text/css">
.ng-cloak {
display: none;
}
</style>
</head>
<body>
<span class="ng-cloak" wildcat>一碰我就跑~~来点我啊~~</span>
<script src="js/angular-1.2.0rc1/angular.js" type="text/javascript"></script>
<script type="text/javascript">
angular.module("HideAnkSeek", []).directive("wildcat", function ($document) {
var maxLeft = 400,maxTop = 300;
var msg = ["我闪~~", "抓我呀~~~", "雅蠛蝶~~", "噢耶~~", "你真逊~！","就差那么一点点了！","继续吧~~总有一天我会累的"];
return function (scope, element, attr) {
element.css({
"position":"absolute",
"border":"1px solid green"
});
element.bind("mouseenter", function (event) {
element.css({
"left":parseInt(Math.random() * 10000 % maxLeft) + "px",
"top":parseInt(Math.random() * 10000 % maxTop) + "px"
}).text(msg[parseInt(Math.random() * 10000 % msg.length)]);
}).bind("click",function (event) {
element.text("噢 My Lady Gaga。。。被你逮到了。。。");
element.unbind("mouseenter");
});
};
});
</script>
</body>
</html>
<span class="ng-cloak" wildcat>一碰我就跑~~来点我啊~~</span>
wildcat 随意定义新的元素属性 并定义新的属性
分享到：
相关推荐
【AngularJS学习笔记1】 AngularJS 是一个强大的前端JavaScript框架，用于构建动态Web应用程序。它通过数据绑定和依赖注入简化了HTML页面与JavaScript代码之间的交互。这篇笔记将深入探讨AngularJS的一些基本概念，...
**AngularJS 框架详解** AngularJS 是一个强大的JavaScript框架，由Google维护，用于构建动态Web应用。它通过MVC（模型-视图-控制器...通过深入学习和实践，你可以有效地利用AngularJS构建高效、可维护的Web应用程序。
### AngularJS学习笔记知识点解析 #### 一、AngularJS简介 AngularJS是由Google推出的一款JavaScript库，虽然在本文档中作者将其称为“工具”，但实际上它更接近于一个完整的前端开发框架。AngularJS的设计理念...
**AngularJS学习笔记** AngularJS，作为一款强大的前端JavaScript框架，由Google维护，主要用于构建单页应用程序（SPA）。它的核心特性包括数据绑定、依赖注入、模块化和指令系统，极大地简化了网页应用的开发流程...
总而言之，这份AngularJS的学习笔记为初学者提供了一个由浅入深、涵盖AngularJS基础知识和核心概念的全面指南。通过对这份笔记的学习，初学者可以逐步掌握AngularJS的使用，从而有效地进行前端开发。
### AngularJS 学习笔记 #### 一、AngularJS 概述 AngularJS 是一个用于构建动态Web应用的开源框架，由 Google 维护。它通过扩展 HTML 的功能来简化 Web 开发，并允许开发者以声明式的方式编写代码，极大地提高了...
这个"angularjs学习笔记本"很可能是包含了关于AngularJS的学习资料、示例代码和教程。AngularJS的核心特性是它使用了MVC（Model-View-Controller）架构模式，提供数据绑定和依赖注入，简化了前端开发。 在AngularJS...
AngularJs学习笔记中涉及了AngularJs的基本概念和操作流程，其知识点主要包括以下几个方面： 一、AngularJs的基本概念 AngularJs是一种前端的JavaScript框架，主要用于构建单页面应用程序。AngularJs的核心特性包括...
### AngularJS 学习笔记知识点总结 #### 一、AngularJS 概述 AngularJS 是由 Google 开发的一款开源 JavaScript 库，它提供了一种全新的应用程序组织与开发方式。AngularJS 的核心特性之一就是**数据双向绑定**，...
【AngularJS学习笔记 - 进出自由,我的分享1】 AngularJS是一款由Google开发的JavaScript框架，用于构建富客户端Web应用程序。它强调数据绑定和依赖注入，简化了前端开发流程，尤其是在实现MVC（模型-视图-控制器）...
本学习笔记将深入探讨AngularJS中的表单验证机制，主要包括以下几个方面： 1. **AngularJS 表单基础**： AngularJS中的表单是基于HTML的，但通过添加`ng-form`指令，可以将其提升为一个AngularJS感知的表单。表单...
1. **双向数据绑定**：AngularJS的核心特性之一就是双向数据绑定，它使得视图（View）和模型（Model）之间的数据可以自动保持同步。在这里，我们可以通过在HTML元素中使用`ng-model`指令将复选框的状态与后台的布尔...
通过Ajax获取JSON数据以我之前写的与用户交互的动态清单列表为例，现在把模型中的数据单独写成一个JSON文件，再通过发起Ajax请求的方式获取JSON数据。这样，清单列表中的数据项就都是通过JSON数据来获取的了。
### AngularJS 学习笔记 —— Directive 的深入解析 #### 一、Directive 概述 在AngularJS中，**Directive**是一种强大的特性，它能够扩展HTML的行为和功能，让开发者能够在网页上创建自定义的标签和行为。...
### 四、AngularJs学习笔记 学习笔记通常包含个人对AngularJS理解的深入点，可能包括一些高级话题，如脏检查（Dirty Checking）、$digest循环，以及如何优化性能。笔记可能还包括解决常见问题的方法，以及作者在...