페이지 로드 후 불러오는 함수 onload, ready, DOMContentLoaded

2023. 7. 19. 11:49·프론트/javascript

전자정부 프레임워크에서 수정 기능을 만들다가,

콤보박스에 전에 선택했던 코드를 불러와서 그 선택항목이 보이도록 하기위해 자바스크립트를 사용하기로 했다.

내가 아는건 $(document).ready인데 이건 제이쿼리가 필요하고, 이거 하나때문에 제이쿼리 cvn을 다운받는 건 비효율적이다.

그래서 찾아본 페이지 로드 후 불러오는 함수 세가지

1.window.onload = function(){}

=> 가장 많이 쓰이지만, 페이지에 이미지, 영상이 포함 되있을 경우 로딩속도가 매우 느리다는 단점이 있다

2. $( document ).ready(function() {});

=> 1의 단점을 보완하나 제이쿼리가 필요함. 

3.document.addEventListener("DOMContentLoaded", function () {});

=> ie8이하에서는 지원하지 않기 때문에 기존에는 잘 쓰이지 않았으나, 요즘은 ie8의 점유율이 매우 낮기 때문에 많이 사용

				<td>
						<select name="gid" id="gid">
							<option value="1">Job(업무)</option>
							<option value="2">Hobby(취미)</option>
						</select>
				</td>
                
        document.addEventListener("DOMContentLoaded", function () {
			var gid = "${codeVO.gid}"; // codeVO의 gid 값을 JavaScript 변수에 할당
			document.getElementById("gid").value = gid; // 해당 값에 해당하는 옵션을 선택
		});

그래서 3번함수를 이용해서 기존 gid를 불러와 콤보박스를 선택할 수 있게 하였다.

저작자표시 (새창열림)

'프론트 > javascript' 카테고리의 다른 글

Invalid left-hand side in assignment  (0) 2023.10.12
캐시 남아서 스크립트 확인 안되는 경우 해결하기  (0) 2023.10.11
'프론트/javascript' 카테고리의 다른 글
  • Invalid left-hand side in assignment
  • 캐시 남아서 스크립트 확인 안되는 경우 해결하기
니누고
니누고
주니어 개발괴발자
  • 니누고
    진땡이코딩조림
    니누고
  • 전체
    오늘
    어제
    • 분류 전체보기 (93)
      • 편안한코딩생활 (12)
        • 오류 해결 일지 (6)
        • 기타등등 (6)
      • 백 (23)
        • jsp (1)
        • spring boot (7)
        • spring (7)
        • 전자정부프레임워크 (8)
      • 프로젝트 (13)
        • 블로그 제작(중단) (12)
      • 프론트 (3)
        • javascript (3)
      • 데이터베이스 (6)
        • oracle (5)
        • 그 외 (1)
      • cs (6)
        • java (4)
        • cs (1)
        • C (1)
      • 코테 (26)
        • java (25)
        • sql (1)
      • 앱 (0)
        • flutter (0)
        • dart (0)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    JPA
    프로그래머스
    카카오 블라인드 채용
    iBatis
    함수
    문자열 정렬하기
    2017팁스다운
    코딩테스트
    가장 큰 수 찾기
    jpa #springboot
    대문자와소문자
    오블완
    Java
    SpringBoot
    Eclipse
    spring
    Oracle
    컴퓨터용량줄이기
    배열
    스프링의 기본 파싱전략
    CRUD
    mod_jk.log
    중복된 문자 제거
    apache
    tomcat
    egov
    oracle함수
    배열 회전시키기
    티스토리챌린지
    전자정부프레임워크
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.1
니누고
페이지 로드 후 불러오는 함수 onload, ready, DOMContentLoaded
상단으로

티스토리툴바