AngularJs中的Jquery

缺乏、安全感 2022-07-12 07:10 171阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>Document</title>
    </head>
    
    <body>
    	<div ng-controller="DemoController">
    		<div class="box">普通一个盒子</div>
    		<button>点击</button>
    	</div>
    	<script src="./libs/jquery.min.js"></script>
    	<script src="./libs/angular.min.js"></script>
    	<script>
    
    		// angular.element() 方法可以将一个原生DOM对象转成jquery对象
    
    		// 原生DOM对象
    		var box = document.querySelector('.box');
    		var btn = document.querySelector('button');
    		// 转成jQuery对象
    		box = angular.element(box);
    		btn = angular.element(btn);
    
    		btn.on('click', function () {
    			// 
    			// box.css('color', 'red');
    
    			box.animate({
    				fontSize: '40px'
    			}, 400);
    		});
    
    		// 但是angularJS 只是实现了jquery对象部分方法
    	</script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，171人围观）

还没有评论，来说两句吧...

相关阅读

相关 Think in AngularJS：对比jQuery和AngularJS的不同思维模式

导言 stackoverflow上有一个人问了一个问题：如果我有jQuery背景，我应该如何切换到AngularJS的思维模式？有一个回复非常经典，获得了

柔情只为你懂/ 2022年09月26日 08:46/ 0 赞/ 139 阅读

相关 Think in AngularJS：对比jQuery和AngularJS的不同思维模式

导言 stackoverflow上有一个人问了一个问题：如果我有jQuery背景，我应该如何切换到AngularJS的思维模式？有一个回复非常经典，获得了

野性酷女/ 2022年08月14日 05:33/ 0 赞/ 143 阅读

相关 JavaScript和JQuery和angularjs操作select

今天使用angularjs操作select下拉列表，发现了一些问题，这里特意来总结一下他和JS,以及jquery的用法； <select>标签定义和用法 s

Dear 丶/ 2022年08月10日 08:51/ 0 赞/ 188 阅读

相关 AngularJS中的Promise

一.Promise Promise是一个接口，它用来处理的对象具有这样的特点：在未来某一时刻（主要是异步调用）会从服务端返回或者被填充属性。其核心是，prom

素颜马尾好姑娘i/ 2022年08月06日 12:16/ 0 赞/ 170 阅读

相关 AngularJs中的Jquery

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti

﹏ヽ暗。殇╰゛Y/ 2022年07月12日 07:10/ 0 赞/ 235 阅读

相关 AngularJs中的Jquery

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti

缺乏、安全感/ 2022年07月12日 07:10/ 0 赞/ 172 阅读

相关深究AngularJS——AngularJS中的Controller(控制器)

先看个示例 <div ng-app="myApp" ng-controller="myCtrl"> <!-- 在该控制器内保存着如下两个Model里的数据 ng-

太过爱你忘了你带给我的痛/ 2022年07月12日 06:51/ 0 赞/ 305 阅读

相关【AngularJS】5.AngularJS 工具方法以及AngularJS中使用jQuery

1. Angularjs 工具方法，参考AngularJS API [https://docs.angularjs.org/api][https_docs.angularjs

叁歲伎倆/ 2022年06月18日 02:27/ 0 赞/ 284 阅读

相关【AngularJS】3.AngularJS 模块中的run方法

AngularJS中的run方法初始化全局数据，只对全局作用域起作用，如$rootScope.多个控制器之间可以共享数据，如下代码所示： <script type="

Love The Way You Lie/ 2022年06月18日 02:24/ 0 赞/ 233 阅读

相关 jquery/angularjs根据元素值删除数组中的元素

在angularjs中使用$scope.array.splice($.inArray(id, $scope.array), 1);来删除元素，把id替换为元素值，把array替

ゝ一纸荒年。/ 2022年05月27日 04:24/ 0 赞/ 405 阅读