code

클래스 이름 또는 ID별로 요소를 가져오는 방법

starcafe 2023. 2. 22. 22:21
반응형

클래스 이름 또는 ID별로 요소를 가져오는 방법

html에서 angularjs로 요소를 찾으려고 합니다.

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 또는 classname으로 요소를 가져올 수 있는 함수가 있습니까?

getElementsByClassName는 DOM Document의 기능입니다.jQuery 함수도 jqLite 함수도 아닙니다.

클래스 이름을 사용할 때 클래스 이름 앞에 마침표를 추가하지 마십시오.

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

jqLite(또는 각도 전에 jQuery가 로드된 경우 jQuery):

var wrappedResult = angular.element(result);

다음 중 선택할 경우element디렉티브의 링크 함수에서는 jqLite 참조 대신 DOM 참조에 액세스해야 합니다.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

를 추가할 필요가 없습니다..getElementsByClassName,예.

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

단, 사용시angular.elementjquery 스타일 셀렉터를 사용해야 합니다.

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

효과가 있을 거야

또한 이 문서에서 "jQuery가 사용 가능한 경우 angular.element는 jQuery 함수의 별칭입니다.jQuery를 사용할 수 없는 경우 angular.element는 "jQuery lite" 또는 "jqLite"라고 하는 Angular의 기본 제공 하위 집합 jQuery에 위임합니다.""

@tasseKATT's Answer는 훌륭하지만 지시를 내리고 싶지 않다면$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');
});

이게 도움이 됐으면 좋겠다.:)

언급URL : https://stackoverflow.com/questions/23609171/how-to-get-element-by-classname-or-id

반응형