Javascript 访问浏览器控制台中的Angularjs元素，如范围或指令

如何在浏览器中访问以下Angularjs项目

$scope， 控制器， 指令， $scope.function

信息：

注意：如果jQuery可用，angular.element是jQuery函数的别名。如果jQuery不可用，angular.element将委托给angular的内置jQuery子集，称为“jQuery lite”或“jqLite”

**

只需使用jquery或jqLite！！！ **

如果您不使用jquery，但只有Angularjs不用担心。您已经在Angularjs文件中封装了jquery的缩写版本

在浏览器中的DOM中的任何项目上单击鼠标右键 （在本例中，我使用的是Google Chrome版本39.0.2171.71（64位））

打开“控制台”选项卡，并在-

angular.element($0)

你应该像这样把东西拿回来

[<my-directive></my-directive>]

您将获得scope对象及其所有优点。假设这是控制器的作用域。 然后您可以在浏览器中直接影响它。在这个示例范围中，有userRoles。让我们更改浏览器中的值

angular.element($0).scope().userRole

说它是“客人”，所以我们把它改成“香蕉”

现在说是“香蕉”

这对于查看DOM中的变量值是非常有用的，但是如果要更改某些内容并查看结果，则必须在DOM中操作某些内容才能查看更改。例如

<div ng-show="butter">HELLO</div>

如果不首先在DOM中操作某些内容，则更改在当前DOM中不可见。在本例中，div应该消失，但不会消失。在我将ng show butter设置为false之后，我需要单击DOM中的某些内容，以使DOM根据更改的值刷新其状态

还有别的

$0表示已在“元素”选项卡中高亮显示的项目。如果你这样做

angular.element($1)

它会在尝试的同时回报一些东西

angular.element($2)

但是，它在这里结束，并且只返回[]，并且每增加一个大于$2的新增量。 如果有人知道这意味着什么，请提供一些信息

当然，您可以使用ID、元素或类访问DOM中的所有内容，就像这样

angular.element('#myDivId')
<div id="myDiv">

angular.element（“#myDivId”）

或

angular.element（“#myDivId p a”）
你好

---

在上面的“信息”链接中有更多的方法和功能，比如如何获取控制器名称。看看吧，永远记住。。。“祝你玩得开心。”

否决投票没关系。也可以就否决投票的原因发表评论，这样事情可以得到纠正和/或更好的解释……让我们一起改进。

angular.element($1)

angular.element($2)

angular.element('#myDivId')
<div id="myDiv">

angular.element('#myDivId p a')
<div id="myDiv">
  <p>hello</p>
    <a href=''...></a>