ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [javascript] 55. DOM 문서(DOM document) - 자바스크립트 강좌 JS / CSE
    Web/JavaScript 2015. 6. 13. 15:36


    JavaScript HTML DOM Document

     HTML DOM에서, 문서 객체(document object)는 웹 페이지 입니다.






    1. The HTML DOM Document

     HTML DOM 객체 모델에서, 문서 객체는 웹 페이지를 나타냅니다.


     문서 객체는 웹 페이지의 모든 다른 객체의 주인 입니다.


     HTML 페이지 내의 객체를 접근 하고 싶을 때, 문서 객체를 접근 하는 것으로 시작 합니다.


     



    2. Finding HTML Elements


    MethodDescription
    document.getElementById()Find an element by element id
    document.getElementsByTagName()Find elements by tag name
    document.getElementsByClassName()Find elements by class name

     [ 출처: W3Schools ]







    3. Changing HTML Elements


    MethodDescription
    element.innerHTML=Change the inner HTML of an element
    element.attribute=Change the attribute of an HTML element
    element.setAttribute(attribute,value)Change the attribute of an HTML element
    element.style.property=Change the style of an HTML element

      [ 출처: W3Schools ]







    4. Adding and Deleting Elements

    MethodDescription
    document.createElement()Create an HTML element
    document.removeChild()Remove an HTML element
    document.appendChild()Add an HTML element
    document.replaceChild()Replace an HTML element
    document.write(text)Write into the HTML output stream

      [ 출처: W3Schools ]





    5. Adding Events Handlers 

    MethodDescription
    document.getElementById(id).onclick=function(){code}Adding event handler code to an onclick event

      [ 출처: W3Schools ]









    6. Finding HTML Objects

     첫 HTML DOM 레벨 1(1998)은 11 HTML 객체, 객체 집합, 속성들을 정의 했습니다. 이러한 것은 HTML5에 아직 유효 합니다.


     후에, HTML DOM 레벨 3에서 더 많은 객체, 집합, 속성들이 추가 되었습니다.



    PropertyDescriptionDOM
    document.anchorsReturns all <a> elements that have a name attribute1
    document.appletsReturns all <applet> elements(Deprecated in HTML5)1
    document.baseURIReturns the absolute base URI of the document3
    document.bodyReturns the <body> element1
    document.cookieReturns the document's cookie1
    document.doctypeReturns the document's doctype3
    document.documentElementReturns the <html> element3
    document.documentModeReturns the mode used by the browser3
    document.documentURIReturns the URI of the document3
    document.domainReturns the domain name of the document server1
    document.domConfigObsolete. Returns the DOM configuration3
    document.embedsReturns all <embed> elements3
    document.formsReturns all <form> elements1
    document.headReturns the <head> element3
    document.imagesReturns all <img> elements1
    document.implementationReturns the DOM implementation3
    document.inputEncodingReturns the document's encoding (character set)3
    document.lastModifiedReturns the date and time the document was updated3
    document.linksReturns all <area> and <a> elements that have a href attribute1
    document.readyStateReturns the (loading) status of the document3
    document.referrerReturns the URI of the referrer (the linking document)1
    document.scriptsReturns all <script> elements3
    document.strictErrorCheckingReturns if error checking is enforced3
    document.titleReturns the <title> element1
    document.URLReturns the complete URL of the document1
      [ 출처: W3Schools ]

    댓글

Designed by Tistory.