當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

22.调用element方法控制dom元素

發布時間：2025/7/14 编程问答 20 豆豆

生活随笔收集整理的這篇文章主要介紹了 22.调用element方法控制dom元素小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

<!DOCTYPE html>
<html ng-app="a101">
<head lang="en">
<meta charset="UTF-8">
<title>T75-調用element方法控制dom元素</title>
<script src="js/angular.js" type="text/javascript"></script>
</head>
<body>
<div ng-controller="c101" class="frame" id="control">
<button ng-click="add()">添加元素</button>
<button ng-click="del()">刪除元素</button>
</div>
</body>

<script type="text/javascript">
var app = angular.module("a101", []);
app.controller("c101", function ($scope, $compile) {
$scope.hello = 'hello,angular!';
$scope.log = function () {
console.log('這是動態添加的方法!');
};
var html = "<div ng-click='log()'>{{hello}}</div>";
var template = angular.element(html);
var newHtml = $compile(template)($scope);//編譯
$scope.add = function () {
angular.element(
document.getElementById("control")).append(newHtml);

};
$scope.del = function () {
if (newHtml) {
newHtml.remove();
}
}
});

</script>

</html>
---------------------------------------------------------------------------------
效果圖：

轉載于:https://www.cnblogs.com/mx2036/p/6781445.html

總結

以上是生活随笔為你收集整理的22.调用element方法控制dom元素的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇： CodeForces 390E Inna
下一篇： Python 3.x标准模块库目录