HTMLLoader 객체에서
complete
이벤트를 전달하면 페이지에 대한 HTML DOM(문서 객체 모델)의 모든 객체에 액세스할 수 있습니다. 액세스할 수 있는 객체에는 표시 객체(예: 페이지의
div
및
p
객체)는 물론 JavaScript 변수 및 함수도 포함됩니다.
complete
이벤트는 JavaScript 페이지
load
이벤트에 해당합니다.
complete
를 전달하기 전에 DOM 요소, 변수 및 함수를 파싱 또는 만들지 못했을 수 있습니다. 가능하면 HTML DOM에 액세스하기 전에
complete
이벤트를 기다립니다.
예를 들어 다음과 같은 HTML 페이지를 살펴봅니다.
<html>
<script>
foo = 333;
function test() {
return "OK.";
}
</script>
<body>
<p id="p1">Hi.</p>
</body>
</html>
이 간단한 HTML 페이지는
foo
라고 하는 JavaScript 변수와
test()
라고 하는 JavaScript 함수를 정의합니다. 이 두 항목 모두 페이지 전역
window
객체의 속성입니다. 또한
window.document
객체에는
getElementById()
메서드를 사용하여 액세스할 수 있는 ID
p1
의 이름이 지정된 P 요소가 포함됩니다. 페이지를 로드하면(HTMLLoader 객체에서
complete
이벤트를 전달하는 경우) 다음 ActionScript 코드에 나와 있는 대로 ActionScript에서 이러한 객체 각각에 액세스할 수 있습니다.
var html:HTMLLoader = new HTMLLoader();
html.width = 300;
html.height = 300;
html.addEventListener(Event.COMPLETE, completeHandler);
var xhtml:XML =
<html>
<script>
foo = 333;
function test() {
return "OK.";
}
</script>
<body>
<p id="p1">Hi.</p>
</body>
</html>;
html.loadString(xhtml.toString());
function completeHandler(e:Event):void {
trace(html.window.foo); // 333
trace(html.window.document.getElementById("p1").innerHTML); // Hi.
trace(html.window.test()); // OK.
}
HTML 요소의 내용에 액세스하려면
innerHTML
속성을 사용합니다. 예를 들어 이전 코드에서
html.window.document.getElementById("p1").innerHTML
을 사용하여
p1
이라고 하는 HTML 요소의 내용을 가져옵니다.
또한 ActionScript에서 HTML 페이지의 속성을 설정할 수 있습니다. 예를 들어 다음은 포함하는 HTMLLoader 객체에 대한 참조를 사용하여 페이지에서
foo
JavaScript 변수의 값 및
p1
요소의 내용을 설정하는 예제입니다.
html.window.document.getElementById("p1").innerHTML = "Goodbye";
html.window.foo = 66;