如何通过类名或ID获取元素

我正在尝试通过angularjs在html中查找元素。

这是html：

<button class="btn btn-primary multi-files" type="button">
   <span>Choose multiple files</span>
</button>
<br/><br/>
<input ng-file-select type="file" multiple  style="display: none"/><br/>

我试图通过类名多文件来获取按钮元素，然后我尝试了

var multibutton = angular.element(element.getElementsByClassName(".multi-files"));

但它不起作用，并尝试过，element.find但仅适用于标签。

在angularjs中，是否有任何函数可以通过ID或类名获取元素？

getElementsByClassName是DOM文档上的函数。它既不是jQuery也不是jqLit​​e函数。

使用时不要在类名前添加句号：

var result = document.getElementsByClassName("multi-files");

将其包装在jqLit​​e中（如果在Angular之前加载jQuery，则包装在jQuery中）：

var wrappedResult = angular.element(result);

如果要从element指令的链接函数中进行选择，则需要访问DOM引用而不是jqLit​​e引用- element[0]而不是element：

link: function (scope, element, attrs) {

  var elementResult = element[0].getElementsByClassName('multi-files');
}

另外，您也可以使用该document.querySelector功能（如果按类选择，则需要此处的句点）：

var queryResult = element[0].querySelector('.multi-files');
var wrappedQueryResult = angular.element(queryResult);

演示： http ：//plnkr.co/edit/AOvO47ebEvrtpXeIzYOH？p = preview

您不必添加.in getElementsByClassName，即

var multibutton = angular.element(element.getElementsByClassName("multi-files"));

但是，在使用时angular.element，您必须使用jquery样式选择器：

angular.element('.multi-files');

应该可以。

另外，从该文档中 “如果jQuery可用，那么angular.element是jQuery函数的别名。如果jQuery不可用，则angular.element委托给Angular的内置jQuery子集，称为“ jQuery lite”或“ jqLit​​e。 ”

@tasseKATT的答案很好，但是如果您不想发出指令，为什么不使用$document？

.controller('ExampleController', ['$scope', '$document', function($scope, $document) {
  var dumb = function (id) {
  var queryResult = $document[0].getElementById(id)
  var wrappedID = angular.element(queryResult);
  return wrappedID;
};

普伦克

如果只想通过按钮的类名并仅使用jQLite查找按钮，则可以执行以下操作：

var myListButton = $document.find('button').filter(function() {
    return angular.element(this).hasClass('multi-files');
});

希望这可以帮助。:)