XML 고려 사항
다음은 XML 기술을 사용하는 경우 사용하지 않는 것을 시도해야 목록입니다.
인터넷 익스플로러 - XML 데이터 아일랜드
그것은 무엇입니까?XML 데이터 아일랜드는 HTML 페이지의 XML 데이터로 매립.
왜 당신은 그것을 피해야한다?XML 데이터 아일랜드는 Internet Explorer 브라우저에서만 유효합니다.
무엇을 대체?당신은 구문 분석하고 표시 XML에 HTML, 자바 스크립트와 XML의 DOM을 사용해야합니다.
자바 스크립트와 XML DOM에 대한 자세한 내용은, 우리의 방문 XML DOM 튜토리얼 .
XML 데이터 아일랜드 인스턴스
이 예제는 "XML 문서를 사용 cd_catalog.xml ."
XML 문서는 <XML> 태그의 HTML 문서에 결합된다. id 속성은 데이터 아일랜드의 식별자와, XML 파일의 src 속성들을 정의한다 :
예
이 예제는 IE 브라우저에만 적용
<body>
<xml id="cdcat" src="cd_catalog.xml"></xml>
<table border="1" datasrc="#cdcat">
<tr>
<td><span datafld="ARTIST"></span></td>
<td><span datafld="TITLE"></span></td>
</tr>
</table>
</body>
</html>
»시도
DATASRC 속성 <표> XML 데이터 섬에 바인딩 된 HTML 테이블의 태그입니다.
<SPAN> 태그 DATAFLD 특성을 표시 할 XML 요소를 참조 할 수 있습니다. 이 예에서, "아티스트"및 "TITLE"를 참조한다. XML을 읽을 때, 각 <CD> 요소에 해당하는 테이블 행을 작성합니다.
인터넷 익스플로러 - 행동
그것은 무엇입니까?인터넷 익스플로러 5는 동작을 소개했다. 동작은 XML (또는 HTML) 요소에 CSS 스타일을 사용하여 동작을 추가하는 방법입니다.
왜 당신은 그것을 피해야한다?만 Internet Explorer가 동작 속성을 지원합니다.
무엇을 대체?자바 스크립트를 사용하여 XML의 DOM (또는 HTML DOM)를 교체 할 수 있습니다.
예 1 - 마우스 호버 하이라이트
는 <H1>에 대한 HTML 파일 <스타일> 요소 다음 요소는 동작을 정의합니다 :
<head>
<style type="text/css">
h1 { behavior: url(behave.htc) }
</style>
</head>
<body>
<h1>Mouse over me!!!</h1>
</body>
</html>
아래 "behave.htc은"(이 파일은 요소에 대한 몇 가지 자바 스크립트 이벤트 핸들러를 포함)하는 XML 문서입니다 :
<attach for="element" event="onmouseout" handler="low_lite" />
<script>
function hig_lite()
{
element.style.color='red';
}
function low_lite()
{
element.style.color='blue';
}
</script>
»시도
예 2 - 타자기 시뮬레이션
다음 HTML 파일은 <스타일> 요소 ID는 요소의 "입력"에 대한 작업을 정의합니다 :
<head>
<style type="text/css">
#typing
{
behavior:url(typing.htc);
font-family:'courier new';
}
</style>
</head>
<body>
<span id="typing" speed="100">IE5 introduced DHTML behaviors.
Behaviors are a way to add DHTML functionality to HTML elements
with the ease of CSS.<br /><br />How do behaviors work?<br />
By using XML we can link behaviors to any element in a web page
and manipulate that element.</p>v </span>
</body>
</html>
XML 문서 "typing.htc는"아래 표시 :
<method name="type" />
<script>
var i,text1,text2,textLength,t;
function beginTyping()
{
i=0;
text1=element.innerText;
textLength=text1.length;
element.innerText="";
text2="";
t=window.setInterval(element.id+".type()",speed);
}
function type()
{
text2=text2+text1.substring(i,i+1);
element.innerText=text2;
i=i+1;
if (i==textLength)
{
clearInterval(t);
}
}
</script>
»시도