Korzystanie JavaScript, możemy uzyskać elementu o id używając następującej składni:Jak zdobyć element według nazwy klasy?
var x=document.getElementById("by_id");
Próbowałem następujących dostać elementu przez klasę:
var y=document.getElementByClass("by_class");
Ale wynikało to do błędu:
getElementByClass is not function
Jak mogę uzyskać element według klasy?
Nazwa funkcji DOM to w rzeczywistości getElementsByClassName, a nie getElementByClassName, po prostu dlatego, że więcej niż jeden element na stronie może mieć tę samą klasę, a więc: Elements.
Wartością zwracaną tego będzie instancja NodeList lub nadzbiór NodeList (FF, na przykład zwraca instancję HTMLCollection). W każdym razie: wartość zwracana jest obiektem tablica podobny:
var y = document.getElementsByClassName('foo');
var aNode = y[0];
Jeśli z jakiegoś powodu potrzeby przedmiotem zwrot w postaci tablicy, można to zrobić łatwo, ponieważ jego magicznej właściwości length:
var arrFromList = Array.prototype.slice.call(y);
//or as per AntonB's comment:
var arrFromList = [].slice.call(y);
jako yckart sugeruje querySelector('.foo') i querySelectorAll('.foo') byłoby korzystne, chociaż są one istotnie lepsze wsparcie (93,99% w porównaniu z 87,24%), zgodnie z caniuse.com:
Dzięki. Zwrócona jest tablica – onmyway133
@ onmyway133: NP. Tylko jedna uwaga: zwracana wartość to * nie * tablica, to obiekt 'NodeList', który zachowuje się jak tablica na wiele sposobów, ale jest różnica. [sprawdź dokumentację MDN] (https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/querySelectorAll), aby uzyskać szczegółowe informacje na temat typu zwrotu i jego specyfikacjach: –
można użyć
getElementsByClassName
załóżmy, że masz pewne elementy i stosować nazwę klasy 'test', tak, można uzyskać elementy takie jak następujące:
var tests = document.getElementsByClassName('test');
jego zwraca wystąpienie NodeList lub jego nadzbiór: HTMLCollection (FF).
To naprawdę nieetyczne w dół głosowanie bez żadnego powodu – Talha
To nie jest, ale tak się dzieje. Nie zrobiłem DV, ale domyślam się, że ktoś ci pomyślał, że twoja odpowiedź albo nie dodała niczego _new_, a twoja edycja stwierdziła, że 'getElementsByClassName' zwraca tablicę, która jest zła. Zmieniono twoją odpowiedź i +1, aby anulować -1 głosowanie –
dziękuję @EliasVanOotegem ale zdarza się czasem ... ja też nie odpowiedziałem DV – Talha
Inną opcją jest użycie, querySelector('.foo') lub querySelectorAll('.foo') który ma szersze poparcie niż getElementsByClassName przeglądarki.
+1 dla querySelector, zamiast getElementsByClassName. –
+1, Spodziewam się, że stosunek wsparcia będzie odwrotny, ale jak się okazuje, IE8 znowu wymiotuje na mojej twarzy ;-), choć nie posunąłbym się aż tak daleko, by powiedzieć, że jest _ " znacznie szersze wsparcie "_ –
@EliasVanOotegem Ok, dobry punkt! Naprawiono :) – yckart
Musisz użyć document.getElementsByClassName('class_name');
i nie zapomnij, że wartość zwracana jest tablica elementów, więc jeśli chcesz pierwszy użyć:
document.getElementsByClassName('class_name')[0]
Wartość zwracana jest * tablicopodobną * 'HTMLCollection', a nie' Tablicą' https://dom.spec.whatwg.org/#dom-document-getelementsbyclassname;) – yckart
Awans dla jednego liniowca . –
Co powoduje, że "document.getElementByClass" jest metodą? Czy wyświetla się w dowolnych wyszukiwaniach Google? –
http://www.w3schools.com/js/js_htmldom.asp wspomina się o tym, że pobiera się element według nazwy klasy, ale nie wspomniano o tym, jak uzyskać element według klasy (nie ma tam żadnej metody). Dlatego pomyślałem, że powinienem spróbować z dokumentem. getElementByClass – TDHM
uważaj, aby użyć w3schools.com jako źródła informacji. Są o wiele lepsze miejsca do nauki. Na przykład [MDN] (https://developer.mozilla.org/en-US/). – Spudley