javascript / html

html에서 dom 객체

document.getElementById('-----' );

• document.getElementById('~~').value;

• document.getElementById("data").disabled = 'disabled';

• document.getElementById("data").removeAttribute("disabled");

  -> HTML data 객체에 disable 설정을 넣고 없애기

//버튼클릭시 실행함수
document.getElementById('data').addEventListener('click', function(evt){
    //버튼이 클릭했을때 
    window.open("popupPath.html", "package popUp", "width=800,height=600");  
    //새로운 팝업창 open
    }); 

dom 객체

var dom = {
    devList : document.getElementById('devList'),
    devInfo : document.getElementById('devInfo'),
    lnb : {
            0 : document.getElementById('lnbMenu_genie'),
            1 : document.getElementById('lnbMenu_package'),
            2 : document.getElementById('lnbMenu_screenShot'),
            3 : document.getElementById('lnbMenu_log'),
    },
    menu : {
        genie_body : document.getElementById('lnbMenu_genie'),
        package_body : document.getElementById('lnbMenu_package'),
        sceenShot_body : document.getElementById('lnbMenu_screenShot'),
        log_body : document.getElementById('lnbMenu_log'),
    },
};


    tab = dom.menu[name];
    dom.menu[log_body];
    dom.lnb[0].classList.add('font-none');
    dom.lnb[1].classList.add('font-none');
    dom.lnb[2].classList.add('font-none');

js에서 html로 값 보내기

• document.getElementById('~~').innerHTML = 보낼데이터;

• document.getElementById('~~').value = 보낼데이터

onLoad vs DomContentLoad 차이

window.onLoad : DOM 다 로드되고나서 //삽입된 컨텐츠(모든 문서, 이미지) 까지도 전부 다운로드가 끝난 지점에서 실행 = 윈도우 모든 load를 완료한 후 스크립트 내용을 실행

ready : dom 만들긴 했는데 이미지는 아직 서버로부터 다운받은 상태가 아니라서, 이미지, 컨텐츠 잘 모름

domContentLoaded : 이미지를 컨트롤하지 않을 시에는 document가 모든 로드된 시점에 스크립트를 적용