詳解angularjs獲取元素以及angular.element()用法
本文介紹了詳解angularjs獲取元素以及angular.element()用法 ,分享給大家,具體如下:
- addClass()-為每個匹配的元素添加指定的樣式類名
- after()-在匹配元素集合中的每個元素后面插入?yún)?shù)所指定的內(nèi)容,作為其兄弟節(jié)點
- append()-在每個匹配元素里面的末尾處插入?yún)?shù)內(nèi)容
- attr() - 獲取匹配的元素集合中的第一個元素的屬性的值
- bind() - 為一個元素綁定一個事件處理程序
- children() - 獲得匹配元素集合中每個元素的子元素,選擇器選擇性篩選
- clone()-創(chuàng)建一個匹配的元素集合的深度拷貝副本
- contents()-獲得匹配元素集合中每個元素的子元素,包括文字和注釋節(jié)點
- css() - 獲取匹配元素集合中的第一個元素的樣式屬性的值
- data()-在匹配元素上存儲任意相關(guān)數(shù)據(jù)
- detach()-從DOM中去掉所有匹配的元素
- empty()-從DOM中移除集合中匹配元素的所有子節(jié)點
- eq()-減少匹配元素的集合為指定的索引的哪一個元素
- find() - 通過一個選擇器,jQuery對象,或元素過濾,得到當(dāng)前匹配的元素集合中每個元素的后代
- hasClass()-確定任何一個匹配元素是否有被分配給定的(樣式)類
- html()-獲取集合中第一個匹配元素的HTML內(nèi)容
- next() - 取得匹配的元素集合中每一個元素緊鄰的后面同輩元素的元素集合。如果提供一個選擇器,那么只有緊跟著的兄弟元素滿足選擇器時,才會返回此元素
- on() - 在選定的元素上綁定一個或多個事件處理函數(shù)
- off() - 移除一個事件處理函數(shù)
- one() - 為元素的事件添加處理函數(shù)。處理函數(shù)在每個元素上每種事件類型最多執(zhí)行一次
- parent() - 取得匹配元素集合中,每個元素的父元素,可以提供一個可選的選擇器
- prepend()-將參數(shù)內(nèi)容插入到每個匹配元素的前面(元素內(nèi)部)
- prop()-獲取匹配的元素集中第一個元素的屬性(property)值
- ready()-當(dāng)DOM準(zhǔn)備就緒時,指定一個函數(shù)來執(zhí)行
- remove()-將匹配元素集合從DOM中刪除。(同時移除元素上的事件及 jQuery 數(shù)據(jù)。)
- removeAttr()-為匹配的元素集合中的每個元素中移除一個屬性(attribute)
- removeClass()-移除集合中每個匹配元素上一個,多個或全部樣式
- removeData()-在元素上移除綁定的數(shù)據(jù)
- replaceWith()-用提供的內(nèi)容替換集合中所有匹配的元素并且返回被刪除元素的集合
- text()-得到匹配元素集合中每個元素的合并文本,包括他們的后代
- toggleClass()-在匹配的元素集合中的每個元素上添加或刪除一個或多個樣式類,取決于這個樣式類是否存在或值切換屬性。即:如果存在(不存在)就刪除(添加)一個類
- triggerHandler() -為一個事件執(zhí)行附加到元素的所有處理程序
- unbind() - 從元素上刪除一個以前附加事件處理程序
- val()-獲取匹配的元素集合中第一個元素的當(dāng)前值
- wrap()-在每個匹配的元素外層包上一個html元素
ng-click得到當(dāng)前元素,angular.element()用法
話題1:ng-click獲得當(dāng)前元素,不多說直接看示例代碼
<!DOCTYPE html> <html> <head> <title></title> <script src="lib/jquery/jquery-1.10.2.min.js"></script> <script src="lib/angular/angular.min.js"></script> </head> <body ng-app> <div ng-controller="TestCtrl"> <a href data="1" ng-click="GoPage($event.target)">1</a> <a href data="2" ng-click="GoPage($event.target)">2</a> <a href data="3" ng-click="GoPage($event.target)">3</a> <a href data="4" ng-click="GoPage($event.target)">4</a> <a href data="5" ng-click="GoPage($event.target)">5</a> {{ page }} </div> <script> function TestCtrl($scope) { $scope.page = 1; $scope.getData = function () { console.log($scope.page); } $scope.GoPage = function (target) { $scope.page = target.getAttribute('data'); this.getData(); } } </script> </body> </html>
話題2:angular.element()用法(這只是一個醬油)
在Control中,angular.element()返回一個jquery對象,如angular.element(document).ready(function(){});
所以你可以對她做你對所有jquery對象可以做的事
返回指定元素的scope:
var sidebar = document.getElementsById('sidebar'); var scope = angular.element(sidebar).scope();
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
angularJs select綁定的model取不到值的解決方法
今天小編就為大家分享一篇angularJs select綁定的model取不到值的解決方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10Angular實現(xiàn)的簡單查詢天氣預(yù)報功能示例
這篇文章主要介紹了Angular實現(xiàn)的簡單查詢天氣預(yù)報功能,涉及AngularJS針對第三方API接口交互的相關(guān)操作技巧,需要的朋友可以參考下2017-12-12angular學(xué)習(xí)之ngRoute路由機制
這篇文章主要介紹了angular學(xué)習(xí)之ngRoute路由機制,ngRoute是一個Module,提供路由和深層鏈接所需的服務(wù)和指令。有需要的可以了解一下。2017-04-04AngularJS基礎(chǔ) ng-mousemove 指令簡單示例
本文主要介紹AngularJS ng-mousemove 指令,這里幫大家整理了ng-mousemove 指令的詳細資料,并附有示例代碼,有需要的朋友參考下2016-08-08Angular懶加載動態(tài)創(chuàng)建顯示該模塊下聲明的組件
這篇文章主要為大家介紹了Angular懶加載動態(tài)創(chuàng)建顯示該模塊下聲明的組件,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-05-05angular學(xué)習(xí)之動態(tài)創(chuàng)建表單的方法
這篇文章主要介紹了angular學(xué)習(xí)之動態(tài)創(chuàng)建表單的方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-12-12