AngularJS中的angular.element()函数用于将DOM元素或HTML字符串初始化为jQuery元素。如果jQuery可用,则angular.element可以用作jQuery函数的别名,也可以用作将元素或字符串包装在Angular的jqlite中的函数。
用法:
angular.element(element)
其中element是指HTML DOM元素或要包装到jQuery中的字符串。
示例1:
<!DOCTYPE html>
<html>
<head>
<script src=
"//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js">
</script>
<title>
angular.element()
</title>
</head>
<body ng-app="app">
<h1 style="color:green">
GeeksforGeeks
</h1>
<h2>
angular.element()
</h2>
<div ng-controller="geek">
<div ng-mouseenter="style()"
id="ide"
ng-mouseleave="remove()">
{{name}}
</div>
</div>
<script>
var app = angular.module("app", []);
app.controller('geek', ['$scope', '$document',
function($scope, $document) {
$scope.name = "GeeksforGeeks";
$scope.style = function() {
angular.element(
$document[0].querySelector('#ide')).css({
'color':'white',
'background-color':'green',
'width':'200px'
});
};
$scope.remove = function() {
angular.element(
$document[0].querySelector('#ide')).css({
'color':'black',
'background-color':'white'
});
};
}
]);
</script>
</body>
</html>
输出:
在Mouseenter之前:
在mouseenter之后:
示例2:
<!DOCTYPE html>
<html>
<head>
<script src=
"//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js">
</script>
<title>
angular.element()
</title>
</head>
<body ng-app="app"
style="text-align:Center">
<h1 style="color:green">
GeeksforGeeks
</h1>
<h2>
angular.element()
</h2>
<div ng-controller="geek">
<input type="text"
id="text"
ng-model="myVal" />
<button ng-click="getVal()">
Click me!
</button>
<br />
<br><b>You typed:</b> {{value}}
</div>
<script>
var app = angular.module("app", []);
app.controller('geek', ['$scope',
'$document', function($scope, $document) {
$scope.myVal = "";
$scope.getVal = function() {
$scope.value = angular.element(
$document[0].querySelector(
'#text')).val();
}
}]);
</script>
</body>
</html>
输出:
输入之前:
输入后:
相关用法
- PHP imagecreatetruecolor()用法及代码示例
- p5.js year()用法及代码示例
- d3.js d3.utcTuesdays()用法及代码示例
- PHP ImagickDraw getTextAlignment()用法及代码示例
- PHP Ds\Sequence last()用法及代码示例
- PHP array_udiff_uassoc()用法及代码示例
- PHP geoip_continent_code_by_name()用法及代码示例
- d3.js d3.map.set()用法及代码示例
- PHP GmagickPixel setcolor()用法及代码示例
- PHP imageistruecolor()用法及代码示例
- PHP opendir()用法及代码示例
- PHP cal_to_jd()用法及代码示例
- d3.js d3.bisectLeft()用法及代码示例
- PHP stream_get_transports()用法及代码示例
注:本文由纯净天空筛选整理自Vishal Chaudhary 2大神的英文原创作品 AngularJS | angular.element() Function。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。