jQuery 같은 프레임웍을 쓰지 않는다면 class name 으로 dom 셀렉팅을 할 수 없습니다.
지난번 javascript 스터디를 통해서 function 타입으로 제작하는 방법을 설명했었는데 조금 더 발전시켜 document 객체에 prototype으로 선언해 getElementById 와 같은 매서드의 형식으로 사용할 수 있도록 제작해봤습니다.
안타깝게도 Document 객체에 prototype 으로 선언하는 것이 IE 시리즈에선 허용되지 않아 아래와 같은 방식으로 우회했습니다.
테스트는 여기서 http://jsfiddle.net/rootbox/gtEkb/
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
document.getElementsByClassName = function(name) { var obj = result = []; var n = name.split("."); var tag_name = null, class_name = null; if(n.length == 2) { tag_name = n[0]; class_name = n[1]; } else { tag_name = "*"; class_name = n[0]; } obj = document.getElementsByTagName(tag_name); for(var i in obj) { if(obj[i].className != class_name) continue; result.push(obj[i]); } return result; }; Element.prototype.getElementsByClassName = function(name) { var obj = result = []; var n = name.split("."); var tag_name = null, class_name = null; if(n.length == 2) { tag_name = n[0]; class_name = n[1]; } else { tag_name = "*"; class_name = n[0]; } obj = this.getElementsByTagName(tag_name); for(var i in obj) { if(obj[i].className != class_name) continue; result.push(obj[i]); } return result; }; console.log(document.getElementsByClassName("p.a")); console.log(document.getElementsByClassName("span.a")); console.log(document.getElementsByClassName("a")); console.log(document.getElementById("a").getElementsByClassName("span.a")); |
우오와~~~~~ 대단하시네요!!!
역시 고수님!!!
왜..왜그러세요ㅠ
아저씨 블로그 버리고 뭐하시는거에요!!
어라? 제대했어요?
헐… 댓글은 열라 빠르네요ㅠㅠㅠ
아저씨 진로상담 해주세요. 죽겠어요.
저 물어볼 사람이 아저씨 밖에 없어요…
ㅎ;;; 댓글 잘 안봐서;; 메일 보냈어요.