用AngularJS操作DOM

在angular中使用第三方插件时最好都封装到指令（directives）中去，DOM操作也最好都解构到指令中。

 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body ng-app="app">
 8 <div class="box" directive>
 9     <div class="ww">22222</div>
10     11111
11 </div>
12 </body>
13 <script type="text/javascript" src="js/jquery-1.9.0.js"></script>
14 <script type="text/javascript" src="js/1.2.26/angular.js"></script>
15 <script type="text/javascript">
16     angular.module('app', []).
17     controller('ctrl', function () {
18 
19     })
20     .directive('directive', function(){
21         return {
22             restrict: 'A',
23             link: function(scope, elem, attrs){
24                 console.log(elem);
25                 $(elem).find('.ww').css('background-color','red');
26                 console.log($(elem).find('.ww').text());
27             }
28         }
29     })
30 
31 </script>
32 </html>

 

 

posted @ 2016-03-24 13:42  SkyTeam_LBM  阅读(410)  评论(0)  编辑  收藏  举报