angularjs获取元素以及angular.element()用法
<p>addClass()-为每个匹配的元素添加指定的样式类名<br data-filtered="filtered">after()-在匹配元素集合中的每个元素后面插入参数所指定的内容，作为其兄弟节点<br data-filtered="filtered">append()-在每个匹配元素里面的末尾处插入参数内容<br data-filtered="filtered">attr() - 获取匹配的元素集合中的第一个元素的属性的值<br data-filtered="filtered">bind() - 为一个元素绑定一个事件处理程序<br data-filtered="filtered">children() - 获得匹配元素集合中每个元素的子元素，选择器选择性筛选<br data-filtered="filtered">clone()-创建一个匹配的元素集合的深度拷贝副本<br data-filtered="filtered">contents()-获得匹配元素集合中每个元素的子元素，包括文字和注释节点<br data-filtered="filtered">css() - 获取匹配元素集合中的第一个元素的样式属性的值<br data-filtered="filtered">data()-在匹配元素上存储任意相关数据<br data-filtered="filtered">detach()-从DOM中去掉所有匹配的元素<br data-filtered="filtered">empty()-从DOM中移除集合中匹配元素的所有子节点<br data-filtered="filtered">eq()-减少匹配元素的集合为指定的索引的哪一个元素<br data-filtered="filtered">find() - 通过一个选择器，jQuery对象，或元素过滤，得到当前匹配的元素集合中每个元素的后代<br data-filtered="filtered">hasClass()-确定任何一个匹配元素是否有被分配给定的（样式）类<br data-filtered="filtered">html()-获取集合中第一个匹配元素的HTML内容<br data-filtered="filtered">next() - 取得匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。如果提供一个选择器，那么只有紧跟着的兄弟元素满足选择器时，才会返回此元素<br data-filtered="filtered">on() - 在选定的元素上绑定一个或多个事件处理函数<br data-filtered="filtered">off() - 移除一个事件处理函数<br data-filtered="filtered">one() - 为元素的事件添加处理函数。处理函数在每个元素上每种事件类型最多执行一次<br data-filtered="filtered">parent() - 取得匹配元素集合中，每个元素的父元素，可以提供一个可选的选择器<br data-filtered="filtered">prepend()-将参数内容插入到每个匹配元素的前面（元素内部）<br data-filtered="filtered">prop()-获取匹配的元素集中第一个元素的属性（property）值<br data-filtered="filtered">ready()-当DOM准备就绪时，指定一个函数来执行<br data-filtered="filtered">remove()-将匹配元素集合从DOM中删除。（同时移除元素上的事件及 jQuery 数据。）<br data-filtered="filtered">removeAttr()-为匹配的元素集合中的每个元素中移除一个属性（attribute）<br data-filtered="filtered">removeClass()-移除集合中每个匹配元素上一个，多个或全部样式<br data-filtered="filtered">removeData()-在元素上移除绑定的数据<br data-filtered="filtered">replaceWith()-用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合<br data-filtered="filtered">text()-得到匹配元素集合中每个元素的合并文本，包括他们的后代<br data-filtered="filtered">toggleClass()-在匹配的元素集合中的每个元素上添加或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即：如果存在（不存在）就删除（添加）一个类<br data-filtered="filtered">triggerHandler() -为一个事件执行附加到元素的所有处理程序<br data-filtered="filtered">unbind() - 从元素上删除一个以前附加事件处理程序<br data-filtered="filtered">val()-获取匹配的元素集合中第一个元素的当前值<br data-filtered="filtered">wrap()-在每个匹配的元素外层包上一个html元素</p><p> <strong id="titleid">ng-click得到当前元素,angular.element()用法</strong><small class="pull-right"></small></p>
<p>话题1：ng-click获得当前元素，不多说直接看示例代码<img class="img-responsive" src="http://www.weiqinxue.cn/blogs/Public/js/kindeditor/plugins/emoticons/images/29.gif" alt="" border="0"></p>
<p> </p>
<div>
<div id="highlighter_916775" class="syntaxhighlighterhtml">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="gutter">
<div class="line number1 index0 alt2">1</div>
<div class="line number2 index1 alt1">2</div>
<div class="line number3 index2 alt2">3</div>
<div class="line number4 index3 alt1">4</div>
<div class="line number5 index4 alt2">5</div>
<div class="line number6 index5 alt1">6</div>
<div class="line number7 index6 alt2">7</div>
<div class="line number8 index7 alt1">8</div>
<div class="line number9 index8 alt2">9</div>
<div class="line number10 index9 alt1">10</div>
<div class="line number11 index10 alt2">11</div>
<div class="line number12 index11 alt1">12</div>
<div class="line number13 index12 alt2">13</div>
<div class="line number14 index13 alt1">14</div>
<div class="line number15 index14 alt2">15</div>
<div class="line number16 index15 alt1">16</div>
<div class="line number17 index16 alt2">17</div>
<div class="line number18 index17 alt1">18</div>
<div class="line number19 index18 alt2">19</div>
<div class="line number20 index19 alt1">20</div>
<div class="line number21 index20 alt2">21</div>
<div class="line number22 index21 alt1">22</div>
<div class="line number23 index22 alt2">23</div>
<div class="line number24 index23 alt1">24</div>
<div class="line number25 index24 alt2">25</div>
<div class="line number26 index25 alt1">26</div>
<div class="line number27 index26 alt2">27</div>
<div class="line number28 index27 alt1">28</div>
<div class="line number29 index28 alt2">29</div>
<div class="line number30 index29 alt1">30</div>
</td>
<td class="code">
<div class="container">
<div class="line number1 index0 alt2"><code class="html plain"><!DOCTYPE html></code></div>
<div class="line number2 index1 alt1"><code class="html plain"><</code><code class="html keyword">html</code><code class="html plain">></code></div>
<div class="line number3 index2 alt2"><code class="html plain"><</code><code class="html keyword">head</code><code class="html plain">></code></div>
<div class="line number4 index3 alt1"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">title</code><code class="html plain">></</code><code class="html keyword">title</code><code class="html plain">></code></div>
<div class="line number5 index4 alt2"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">script</code> <code class="html color1">src</code><code class="html plain">=</code><code class="html string">"lib/jquery/jquery-1.10.2.min.js"</code><code class="html plain">></</code><code class="html keyword">script</code><code class="html plain">></code></div>
<div class="line number6 index5 alt1"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">script</code> <code class="html color1">src</code><code class="html plain">=</code><code class="html string">"lib/angular/angular.min.js"</code><code class="html plain">></</code><code class="html keyword">script</code><code class="html plain">></code></div>
<div class="line number7 index6 alt2"><code class="html plain"></</code><code class="html keyword">head</code><code class="html plain">></code></div>
<div class="line number8 index7 alt1"><code class="html plain"><</code><code class="html keyword">body</code> <code class="html plain">ng-app></code></div>
<div class="line number9 index8 alt2"><code class="html plain"><</code><code class="html keyword">div</code> <code class="html color1">ng-controller</code><code class="html plain">=</code><code class="html string">"TestCtrl"</code><code class="html plain">></code></div>
<div class="line number10 index9 alt1"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">a</code> <code class="html plain">href </code><code class="html color1">data</code><code class="html plain">=</code><code class="html string">"1"</code> <code class="html color1">ng-click</code><code class="html plain">=</code><code class="html string">"GoPage($event.target)"</code><code class="html plain">>1</</code><code class="html keyword">a</code><code class="html plain">></code></div>
<div class="line number11 index10 alt2"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">a</code> <code class="html plain">href </code><code class="html color1">data</code><code class="html plain">=</code><code class="html string">"2"</code> <code class="html color1">ng-click</code><code class="html plain">=</code><code class="html string">"GoPage($event.target)"</code><code class="html plain">>2</</code><code class="html keyword">a</code><code class="html plain">></code></div>
<div class="line number12 index11 alt1"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">a</code> <code class="html plain">href </code><code class="html color1">data</code><code class="html plain">=</code><code class="html string">"3"</code> <code class="html color1">ng-click</code><code class="html plain">=</code><code class="html string">"GoPage($event.target)"</code><code class="html plain">>3</</code><code class="html keyword">a</code><code class="html plain">></code></div>
<div class="line number13 index12 alt2"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">a</code> <code class="html plain">href </code><code class="html color1">data</code><code class="html plain">=</code><code class="html string">"4"</code> <code class="html color1">ng-click</code><code class="html plain">=</code><code class="html string">"GoPage($event.target)"</code><code class="html plain">>4</</code><code class="html keyword">a</code><code class="html plain">></code></div>
<div class="line number14 index13 alt1"><code class="html spaces"> </code><code class="html plain"><</code><code class="html keyword">a</code> <code class="html plain">href </code><code class="html color1">data</code><code class="html plain">=</code><code class="html string">"5"</code> <code class="html color1">ng-click</code><code class="html plain">=</code><code class="html string">"GoPage($event.target)"</code><code class="html plain">>5</</code><code class="html keyword">a</code><code class="html plain">></code></div>
<div class="line number15 index14 alt2"><code class="html spaces"> </code><code class="html plain">{{ page }}</code></div>
<div class="line number16 index15 alt1"><code class="html plain"></</code><code class="html keyword">div</code><code class="html plain">></code></div>
<div class="line number17 index16 alt2"><code class="html plain"><</code><code class="html keyword">script</code><code class="html plain">></code></div>
<div class="line number18 index17 alt1"><code class="html spaces"> </code><code class="html plain">function TestCtrl($scope) {</code></div>
<div class="line number19 index18 alt2"><code class="html spaces"> </code><code class="html plain">$scope.page = 1;</code></div>
<div class="line number20 index19 alt1"><code class="html spaces"> </code><code class="html plain">$scope.getData = function () {</code></div>
<div class="line number21 index20 alt2"><code class="html spaces"> </code><code class="html plain">console.log($scope.page);</code></div>
<div class="line number22 index21 alt1"><code class="html spaces"> </code><code class="html plain">}</code></div>
<div class="line number23 index22 alt2"><code class="html spaces"> </code><code class="html plain">$scope.GoPage = function (target) {</code></div>
<div class="line number24 index23 alt1"><code class="html spaces"> </code><code class="html plain">$scope.page = target.getAttribute('data');</code></div>
<div class="line number25 index24 alt2"><code class="html spaces"> </code><code class="html plain">this.getData();</code></div>
<div class="line number26 index25 alt1"><code class="html spaces"> </code><code class="html plain">}</code></div>
<div class="line number27 index26 alt2"><code class="html spaces"> </code><code class="html plain">}</code></div>
<div class="line number28 index27 alt1"><code class="html plain"></</code><code class="html keyword">script</code><code class="html plain">></code></div>
<div class="line number29 index28 alt2"><code class="html plain"></</code><code class="html keyword">body</code><code class="html plain">></code></div>
<div class="line number30 index29 alt1"><code class="html plain"></</code><code class="html keyword">html</code><code class="html plain">></code></div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<p>话题2：angular.element()用法（这只是一个酱油<img class="img-responsive" src="http://www.weiqinxue.cn/blogs/Public/js/kindeditor/plugins/emoticons/images/13.gif" alt="" border="0">）</p>
<p class="entry-title">在Control中，angular.element()返回一个jquery对象，如angular.element(document).ready(function(){});</p>
<p class="entry-title">所以你可以对她做你对所有jquery对象可以做的事<img class="img-responsive" src="http://www.weiqinxue.cn/blogs/Public/js/kindeditor/plugins/emoticons/images/127.gif" alt="" border="0"></p>
<p>返回指定元素的scope：<span class="line"><span class="kd">var <span class="nx">sidebar <span class="o">= <span class="nb">document<span class="p">.<span class="nx">getElementsById<span class="p">(<span class="s1">'sidebar'<span class="p">); <span class="line"><span class="kd">var <span class="nx">scope <span class="o">=<span class="nx">angular<span class="p">.<span class="nx">element<span class="p">(<span class="nx">sidebar<span class="p">).<span class="nx">scope<span class="p">();</span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></span></p><br><br>
来源：https://www.cnblogs.com/telwanggs/p/12092683.html
頁:
[1]