AngularJS HTML DOM 学习笔记
什么是 HTML DOM
HTML DOM (Document Object Model) 定义了访问和操作 HTML 文档的标准方法。DOM 将 HTML 文档呈现为带有元素、属性和文本的树结构（节点树）。
在 AngularJS 中访问 HTML DOM
在 AngularJS 中，可以使用内置的 document 服务是代表浏览器中的文档对象的 AngularJS 对象，它使得开发者可以方便地访问和操作 HTML DOM。
实例：在 AngularJS 中访问元素并修改样式
以下实例演示了如何在 AngularJS 中访问元素并修改样式：
htmlCopy Code<!DOCTYPE html>
<html ng-app="myApp" ng-controller="myCtrl">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $document) {
$scope.changeColor = function() {
var x = $document[0].getElementById("demo");
x.style.color = "red";
}
});
</script>
</head>
<body>
<h1 id="demo" ng-click="changeColor()">Hello World!</h1>
</body>
</html>
在这个例子中，我们首先创建了一个名为 myApp 的 AngularJS 应用。然后我们在 myCtrl 控制器中定义了一个 $scope.changeColor 函数，该函数将在单击 "Hello World!" 标题时被调用。
在 $scope.changeColor 函数中，我们使用了 $document[0] 对象来访问浏览器文档，并通过 getElementById() 方法获取了 "demo" 元素。最后，我们修改了该元素的颜色为红色。
结论
HTML DOM 是访问和操作 HTML 文档的标准方法，而在 AngularJS 中，可以使用内置的 $document 服务来访问和操作 HTML DOM。通过使用 $document 和其他相关的 AngularJS 服务，开发者可以更加方便地开发基于 AngularJS 的 Web 应用程序。