'getElementsByClassName' trong javascript không chạy

Nheo · March 23, 2018, 12:36pm

đây là code:

Css:

.nh-total{float:left ; width:500px; background:#eee}
.nh-label { float:left ;width: auto; margin-right: 5px;}
.nh-gachchan{float: left; border-bottom: 1px solid #999; margin-top: -5px}
.nh-date{float:right;margin-left: 5px; }

mục đích đoạn code này làm chức năng như sau:
có 4 div :

label (tiêu đề bên trái)
khoản giữa (đường line gạch chân)
ngày tháng (bên phải)
và div total (chứa 3 thăng trên)

khi mà tổng chiều dài text tiêu đề + ngày tháng dài ra + thì chiều dài phần line gạch chân sẽ bằng chiều dài của div tổng - ( chiều dài tiêu đề + ngày tháng )

ở đây tôi dùng javascript với cú pháp chọn đối tượng bằng id (getElementById) thì nó hiển thị đúng mong muốn , nhưng dùng id thì phải là 1 id duy nhất , nên khi sử dụng cái cụm label này cho nhiều vị trí trong trang web như vậy thì bị đụng id , kết quả là chỉ có vị trí cụm label đầu tiên hiện cái đường line chân , còn mấy vị trí khác thì không chạy được , nên tôi dùng getElementsByClassName thì nó lại không hiển thị.dù test thử chỉ có 1 cụm label thôi, như trong hình minh họa .
Nhờ anh em xem giúp vì sao mà dùng getElementsByClassName nó lại ko hiện cái đường line gạch chân.

sao mình copy-past đọa code html để mọi người khỏi gõ lại thì nó ko hiện ra nhỉ

<!DOCTYPE html>

.nh-total{float:left ; width:500px; background:#eee} .nh-label { float:left ;width: auto; margin-right: 5px;} .nh-gachchan{float:left; border-bottom:1px solid #999; margin-top:-5px} .nh-date{float:right;margin-left: 5px; }

getElementByIdĐi hái phù vân

18/03/2018

angrycode · March 24, 2018, 12:27am

-getElementsByClassName sẽ trả về 1 HTML Collections
-HTML Collections là giống như một mảng gồm nhiều phần tử HTML bên trong
-Ví dụ <p class="class1"></p’ . Sau đó, var myCollection = document.getElementsByClassName("class1"); thì khi đó biến myCollection là một mảng chỉ có 1 phần tử HTML đó là <p class="class1"></p>
-Cũng tương tự nếu mình cho <div class="class1"></div>, thì khi đó myCollection của mình một mảng gồm 2 phần tử, với myCollection[0] là <p class="class1"></p> , còn myCollection[1] là <div…

-nên khi bạn xài var l = document.getElementsByClassName("nh-label"), và tương tự cho các biến r,t thì bạn phải sử dụng thêm cú pháp var l = document.getElementsByClassName("nh-label")[0] thì mới sử dụng được.

Hy vọng giúp ích cho bạn

Nheo · March 23, 2018, 11:40pm

học rồi, giờ quên mất , cảm ơn Trung Nguyễn nhiều nha.