이벤트 핸들러를 사용하지 않고 DOM이로드 되 자마자 특정 클래스의 요소에서 함수를 실행합니다.

Question

특정 클래스의 모든 요소에서 실행하려는 간단한 기능이 있습니다. DOM이로드 되 자마자이 기능이 실행되기를 원합니다. 이벤트 핸들러가 아닙니다.

아래는 호버와 같은 이벤트 핸들러에서 실행되는 코드입니다. DOM이로드 되 자마자 어떻게 실행합니까?

$(document).ready(function(){
    var displayname = $(".displayname");

    function alignSpans(){
        var spanheight = this.offsetHeight;
        var cssbottom = spanheight + "px";
        this.style.bottom = cssbottom; 
    }

    displayname.hover(alignSpans);

});

displayname.alignSpans(); 작동하지 않습니다

Answer 1

가정합니다 displayname jQuery 객체입니다. 사용할 수 있습니다 .each() 콜백 함수를 사용하여 호출합니다 this 포함 된 DOM 요소 (이벤트 핸들러와 매우 편리하게 동일한 규칙).

displayname.each(alignSpans);

Answer 2

그것이 .Each () 함수의 것입니다. 코드도 좀 더 효율적으로 만들었습니다.

$(document).ready(function(){
    $(".displayname").each(function() {
        $(this).css("bottom", $(this).height()); 
    });
});