html5 가이드-2. documentmetadata_html5 튜토리얼 팁 작동 방법
오늘의 내용은 문서 객체를 조작하는 방법에 관한 내용입니다. 1. 문서 메타데이터 조작 먼저 관련 속성을 살펴보겠습니다. charset: 현재 문서의 인코딩 모드를 가져옵니다. 이 속성은 읽기 전용입니다. charset: 현재 문서의 인코딩 모드를 가져오거나 설정합니다. 현재 문서의 호환성 모드; cookie: 현재 문서의 쿠키 개체를 가져오거나 설정합니다. defaultCharset: 브라우저의 기본 인코딩을 가져옵니다. dir: 텍스트 정렬을 가져오거나 설정합니다. 현재 문서; 도메인: 현재 문서의 텍스트 정렬을 가져오거나 설정합니다. 구현: 지원되는 DOM 기능에 대한 정보를 제공합니다. lastModified: 문서의 마지막 수정 시간을 가져옵니다(마지막 수정 시간이 없으면 현재를 반환합니다). 시간); 위치: 현재 문서의 URL 정보를 제공합니다. Status: 이 속성은 읽기 전용 속성입니다. 현재 문서 제목에 연결된 문서 URL 정보를 반환합니다. 현재 문서의 제목을 설정합니다. 다음 예를 살펴보세요:
코드는 다음과 같습니다: example'); 결과(브라우저에 따라 표시되는 결과가 다를 수 있음):
이해하는 방법 호환성 모드 compatMode 속성은 브라우저가 현재 문서를 처리하는 방법을 알려줍니다. 비표준 HTML이 너무 많아서 브라우저는 HTML 사양을 따르지 않더라도 이러한 페이지를 표시하려고 시도합니다. 일부 콘텐츠는 브라우저 전쟁 초기에 존재했던 고유한 기능에 의존하며 이러한 속성은 사양을 준수하지 않습니다. compatMode는 다음과 같이 하나 또는 두 개의 값을 반환합니다. CSS1Compat: 문서가 유효한 HTML 사양을 준수합니다(HTML5일 필요는 없으며 확인된 HTML4 페이지도 이 값을 반환함). BackCompat: 문서에 사양을 준수하지 않는 기능이 포함되어 있습니다. 호환성 모드를 트리거합니다. 3. Location 개체 사용 document.location은 Location 개체를 반환하여 문서의 세부적인 주소 정보를 제공하고 다른 문서로 이동할 수 있도록 합니다. 프로토콜: 문서 URL의 프로토콜을 가져오거나 설정합니다. 호스트: 문서의 주소 정보를 가져오거나 설정합니다. 호스트 이름: 문서의 호스트 이름을 가져오거나 설정합니다. 문서 URL 정보의 쿼리 부분: 문서 URL의 해시 부분 정보를 가져오거나 설정합니다. (): 현재 문서를 다시 로드합니다. 해결URL(): 상대 경로를 절대 경로로 변환합니다. 다음 예를 살펴보세요:
코드는 다음과 같습니다: '); 결과:
4. 쿠키 읽기 및 쓰기 쿠키 속성을 통해 추가, 수정 및 문서 작동의 쿠키를 읽으십시오.
예를 들면:
코드는 다음과 같습니다: 예
Add CookieUpdate CookieClear Cookievar cookieCount = 0; document.getElementById('update').onclick = updateCookie; 'write') .onclick = createCookie; document.getElementById('clear').onclick = readCookies(); function readCookies() { document.getElementById('cookiedata').innerHTML = !document.cookie ? document.cookie; } function updateCookie() { document.cookie = 'cookie_' cookieCount '=update_' cookieCount; readCookie() } function createCookie() { cookieCount; document.cookie_' cookieCount '=value_' cookieCount; readCookies(); } functionclearCookie() { var exp = new Date(); exp.setTime(exp.getTime() - 1); var arrStr = document.cookie.split("; "); 0; i
5. ReadyState 이해 document.readyState는 페이지 로드 및 구문 분석 중 페이지의 현재 상태를 이해하는 데 도움이 됩니다. , 스크립트 실행을 지연하기 위해 defer 속성을 사용하지 않는 한, ReadyState에는 서로 다른 상태를 나타내는 세 가지 값이 있습니다. 로드 중: 브라우저가 문서를 로드하고 실행 중입니다. 외부 리소스(미디어, 사진 등) ; 완료: 페이지 구문 분석이 완료되고 외부 리소스가 집에서 완료됩니다. 브라우저의 전체 로딩 및 구문 분석 과정에서 ReadyState의 값은 로딩, 대화형, 완료 순으로 하나씩 변경됩니다. ReadyStatechange 이벤트(readyState 상태가 변경될 때 트리거됨)와 함께 사용되면 ReadyState는 매우 유용해집니다.
코드는 다음과 같습니다. 위의 예제 코드는 실행 지연 효과를 얻기 위해 Readystatechange 이벤트를 사용합니다. 이때 전체 페이지를 구문 분석하고 접속한 후에만 Readystate 값이 대화형이 됩니다. pressme 버튼이 바인딩되었습니다. 클릭 이벤트를 정의합니다. 이 작업을 통해 필요한 html 요소가 있는지 확인하고 오류 발생을 방지할 수 있습니다. 6. dom 속성 구현에 대한 정보를 얻습니다. document.implementation 속성은 브라우저의 dom 속성 구현을 이해하는 데 도움이 됩니다.
이 속성은 hasFeature 메소드를 포함하는 DOMImplementation 객체를 반환합니다. 이 메소드를 사용하면 브라우저의 특정 속성 구현을 이해할 수 있습니다.
코드는 다음과 같습니다: 예") 효과: