테스트 사이트 - 개발 중인 베타 버전입니다

getElementById와 getElementsByClassName 사용법에 대해 질문드립니다. 채택완료

클래스는영원히 5년 전 조회 2,390

안녕하세요

항상 sir 고수님들의 많은 도움을 받고있는 회원입니다.

정말 감사드립니다.

다름이아니라 한 부분이 막혀 질문드리게되었는데요

getElementById와 getElementsByClassName 사용법에 대해 질문드립니다.

 

<script>
    function replace_id(){
    var txt = document.getElementById('area_replace_<?= $data["c_idx"] ?>').value;
    txt = txt.replace(/\n$/g, '');

    document.getElementById('area_replace_<?= $data["c__idx"] ?>').value = txt;
    }
</script>
이 스크립트는 공백을 제거해주는 스크립트인데요

getElementById로 짜여진 스크립트입니다.

아무 이상없이 잘 작동합니다.

 

                                     
<script>
    function replace_class(){
    var txt = document.getElementsByClassName('area_replace_<?= $data["c_idx"] ?>').value;
    txt = txt.replace(/\n$/g, '');

    document.getElementsByClassName('area_replace_<?= $data["c_idx"] ?>').value = txt;
    }
</script>

이 스크립트는 위와 동일한 기능을 하는 소스입니다.

getElementsByClassName로 class를 지정해주려는데

작동을 하지 않습니다.

 

혹시 getElementsByClassName로 바꾸는도중 잘못 사용한 부분이 있을까요?

고수님들의 많은 조언 부탁드립니다.

댓글을 작성하려면 로그인이 필요합니다.

답변 3개

채택된 답변
+20 포인트
B
5년 전

</p>

<p><script></p>

<p>// 공백 제거 아님. 어쨌거나 area_replace_고유번호 클래스명이 1개만 존재할 때…

    function replace_class(){

    var txt = document.<strong>getElementsByClassName</strong>('area_replace_<?= $data["c_idx"] ?>')[0].value;

    txt = txt.replace(/\n$/g, '');</p>

<p>    document.<strong>getElementsByClassName</strong>('area_replace_<?= $data["c_idx"] ?>')[0].value = txt;

    }

</script></p>

<p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

클래스는영원히
5년 전
BiHon님 답변 감사드립니다.
덕분에 바로 해결되었습니다.
정말 감사합니다.

편안한 저녁시간되세요^^

댓글을 작성하려면 로그인이 필요합니다.

getElementById() 와 달리 getElementsByClassName()는 여러개가 있을 수 있기 때문에 리턴값이 배열입니다.

그래서 아래와 같이 사용합니다.

 

</p>

<pre class="brush: js line-numbers  language-js">
var matches = element.getElementsByClassName('colorbox');
for (var i=0; i<matches.length; i++) {
    matches.item(i).classList.add('hueframe');
}</pre>

<p>

 

출처: https://developer.mozilla.org/ko/docs/Web/API/Element/getElementsByClassName

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

클래스는영원히
5년 전
취미생활님 답변 감사드립니다.
해결되었습니다.
많은 도움이 되었습니다!
편안한 저녁시간되세요^^

댓글을 작성하려면 로그인이 필요합니다.

플래토
5년 전

음. 혹시

area_replace_0 과 같은 클래스가 없는거 아닐까요?

 

아무래도 

getElementsByName 이거나

클래스명이 area_replace  정도로 통일된 형태거나 할거 같은데

보통은

var txt = document.getElementsByClassName('area_replace_<?= $data["c_idx"] ?>').value;

가 아닌

 

var txts = document.getElementsByClassName('area_replace');

var txt =  txts[<?php echo $data["c_idx"]?>].value;

 

와 같이 접근해야 하지 않을까 싶어보입니다.

 

 

로그인 후 평가할 수 있습니다

답변에 대한 댓글 3개

클래스는영원히
5년 전
플래토님 답변 감사드립니다.
바로 적용해보았는데 이상하게 작동하지를 않네요 ㅜㅜ
한 번 다시 시도해보겠습니다.

매번 정말 감사드립니다!
플래토
5년 전
@클래스는영원히
바로 적용하시면 안될것이구요

실제 보시려는 클래스명을 확인하신후에 처리하셔야 합니다.
클래스는영원히
5년 전
플래토님 매번 정말 큰 도움을 주셔서 감사드립니다.
해결되었습니다
편안한 저녁시간되세요^^

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인