AngularJs angular.element
angular.element
将DOM元素或者HTML字符串一包装成一个jQuery元素。
格式:angular.element(element);
element:包装成jquery对象的html字符串或者dom元素
jqLite提供的方法:
- addClass()
- after()
- append()
- attr()
- bind() – 不支持命名空间,选择器和事件数据
- children() – 不支持选择器
- clone()
- contents()
- css()
- data()
- empty()
- eq()
- find() – 限定通过标签名称查找
- hasClass()
- html()
- next() – 不支持选择器
- on() – 不支持命名空间或选择器
- off() –不支持命名空间或选择器
- one() – 不支持命名空间或选择器
- parent() – 不支持选择器
- prepend()
- prop()
- ready()
- remove()
- removeAttr()
- removeClass()
- removeData()
- replaceWith()
- text()
- toggleClass()
- triggerHandler() -通过一个虚拟事件对象来处理。
- unbind() – 不支持命名空间
- val()
- wrap()
事件:
$destory:当Dom被移除时, Angular 拦截所以的jqLite或者jquery Dom对象,销毁api和事件。这个事件能在Dom被移除前用来清除任何Dom上的相关。
方法:
controller(name):检索当前元素或其父元素的controller,默认情况下,检索与ngController相关的controller,如果name是以驼峰模式命名的指令名称,那么这个指令的controller就是这样(如’ngModel’) 。
injector():检索当前元素或其父元素的依赖注入。
scope():检索当前元素或其父元素的scope。
isolateScope():如果有一个scope直接附着在当前元素,检索一个隔离的scope,这仅用于元素包含一个创建了新的隔离的scope的指令,这个元素调用scope()总是返回原来的非隔离scope。
inheritedData():和data()一样,但是会沿着Dom走直到值被找到或者走到顶级Dom元素。(由此可见,应该是向上传播的意思。)
使用代码:
<div ng-app="Demo">
<div ng-controller="testCtrl as ctrl">
<div id="myDiv">Hello World!!!</div>
</div>
</div
(function () {
angular.module("Demo", [])
.controller("testCtrl", testCtrl);
function testCtrl() {
var element = angular.element("#myDiv");
console.log(element)
//element是个对象
//第一个属性就是id为myDiv的div对象;
//第二个属性名为content,值是document;
//第三个属性名是length,值为1;第四个属性名是selector,值是"#myDiv"
};
}());
特别提醒哦,在controller里操作Dom是要剁手的...Ng如果需要对Dom进行操作则需要在指令里处理代码,像我们在Ng开发中封装一些jQuery插件使用时,也是通过指令来的。
angular.element把Dom元素或者HTML的字符串包装成jQuery对象,假如你在angular之前引用了jQuery,那么这就相当于jQuery的选择器了,你也可以把jQuery的一些dom操作对他使用;那么如果你就是这么任性,不引用jQuery呢?别着急,ng自带jqLite,上面也把jqLite对这个方法包装成的对象提供的一些方法都列出来了,有需要的可以去看看,不过毕竟是轻量版的,功能没那么齐全,如需更多操作,可在angular[.min].js文件之前引入jQuery文件。
AngularJs angular.element的更多相关文章
- angular.element方法汇总以及AngularJS 动态添加元素和删除元素
addClass()-为每个匹配的元素添加指定的样式类名after()-在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点append()-在每个匹配元素里面的末尾处插入参数内容att ...
- AngularJS操作DOM——angular.element
addClass()-为每个匹配的元素添加指定的样式类名 after()-在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点 append()-在每个匹配元素里面的末尾处插入参数内容a ...
- angularjs获取元素以及angular.element()用法
addClass()-为每个匹配的元素添加指定的样式类名 after()-在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点 append()-在每个匹配元素里面的末尾处插入参数内容 ...
- Angular.element和$document的使用方法分析,代替jquery
AngularJs是不直接操作DOM的,但是在平时的开发当中,我们有的时候还是需要操作一些DOM的,如果使用原生的JS的话操作过于麻烦,所以大家一般都是使用jQuery,jQuery虽然好用,但是An ...
- angular.element 动态添加和删除元素
addClass()-为每个匹配的元素添加指定的样式类名after()-在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点append()-在每个匹配元素里面的末尾处插入参数内容att ...
- angularJS DOM element() $compile()
我们可以使用angularJS来动态地添加和删除节点 与jQuery不同的是,html字符串需要经过$compile()方法的编译才能产生html的DOM的node 注意element()方法的使用 ...
- AngularJs Angular数据类型判断
angular.isArray 判断括号内的值是否为数组. 格式:angular.isArray(value); value: 被判断是否为数组的值. ------------------------ ...
- angular.element函数
听说这个 element 函数和 jQuery 里的 $() 差不多 element函数有一个参数,传入的是一个对象,后面可以接着点其他的方法,如果jQuery可用的话就可以在它的后面点jQuery的 ...
- ng-click得到当前元素,angular.element()用法
<!DOCTYPE html> <html> <head> <title></title> <script src="lib ...
随机推荐
- nios II--实验7——数码管IP硬件部分
数码管 硬件开发 新建原理图 打开Quartus II 11.0,新建一个工程,File -> New Project Wizard…,忽略Introduction,之间单击 Next> ...
- 删除root子目录,如何恢复子目录配置文件
手贱,一不小心rm -rf 问题描述:删除/root/子目录文件(含隐藏配置文件)shell变成-bash-4.2#,如何恢复原貌 解决方法: root用户进入,自己配置相关文件:mkdir /roo ...
- python作为一种胶水和c/c++
如果需要用 Python 调用 C/C++ 编写的第三方库,只需要一个脚本语言来粘合它们.这个时候,用 Python ctypes 可以很方便地实现调用. StackOverflow 上的 Calli ...
- 揭秘PHP匿名函数
揭秘PHP匿名函数 定义:匿名函数就是没有名字的函数. 有2种形式的匿名函数: 形式1:将一个匿名函数"赋值"给一个变量--此时该变量就代表该匿名函数了! 形式2: 是直接将一个匿 ...
- Oracle空串与null的处理
来源于:http://blog.itpub.net/24870090/viewspace-1057853/ Oracle空串与null的处理[@more@] Oracle中的空字符串基本上是被当成空N ...
- MVC 理解小谈
1. 如何理解MVC MVC 是一种经典的设计模式,全名为 Model-View-Controller,即 模型-视图-控制器. 其中,模型 是用于封装数据的载体,其本质是一个普通的 Java Bea ...
- 分布式搜索引擎Elasticsearch PHP类封装 使用原生api
//官方的 php api写的鸡肋了,下面这个类可以使用 es api 操作. <?php class ElasticSearch { public $index; function __co ...
- 我的第一个jsp程序-实现注册登录留言功能
1,注册功能,包括两个页面 zhuce.jsp注册页面 <%@ page language="java" contentType="text/html; chars ...
- 基于Oracle的Mybatis 批量插入
项目中会遇到这样的情况,一次性要插入多条数据到数据库中,有两种插入方法: 方法一: Mybatis本身只支持逐条插入,比较笨的方法,就是遍历一个List,循环中逐条插入,比如下面这段代码 for(Da ...
- 问题-栈S最多能容纳4个元素,现有6个元素按A、B、C、D、E、F顺序进栈,问可能的出栈顺序。
住栈的特性:对于取出栈内元素每次只能从栈顶开始取(后进先出(栈满时,只能先出后进)) 由于栈内只能容纳4个元素: 所以 E F不可能第一个出栈: 当栈内少于四个元素时 既可以选择进栈,也可以选择出栈 ...