"&"를 "&"로 써야 하는 이유??

문자 참조

XHTML에서는 거의 모든 요소의 내용모델이 "#PCDATA"(Parsed Character DATA, 해석 처리되는 문자 데이터)로 여겨지기 때문에 "<", ">", """, "&" 등의 기호를 통상의 텍스트에 사용하면 문자 데이터가 아니라 XHTML특유의 기호로 인식한다.

이처럼 XHTML 상의 특수기호가 그대로 표시되도록 기술하거나 키보드로 입력할 수 없는 문자를 기술하기 위한 방법을 문자 참조(character references) 라고 한다.

문자 참조는 미리 정해진 앰퍼센트 "&" 에서 세미콜론 ";" 까지의 내용을 기술하여 표현한다.

이러한 문자 참조에는 문자 개체 참조(character entity reference)와 수치 문자 참조(numerical character reference)의 두가지 나뉘면 문자 개체 참조와 수치 문자 참조는 모두 아래의 세가지 형태로 구분된다.

예제

이 때문에 URL에 앰퍼샌드("&")이 포함되어 있으면 W3C의 Markup validation Service나 파이어폭스의 부가기능 중 Html Validator 등을 이용해서 Markup 유효성을 체크해보면 다음과 같은 에러가 발생하게 된다.

* Markup
<a href="foo.cgi?chapter=1&section=2&copy=3&lang=en">…</a>
* Error Message

이 Error Message는 앰퍼샌드("&")가 문자 개체 참조(entity reference)의 시작으로 추정되면서 생기는 오류이다.
즉 문자 참조를 의도하지 않았지만 앰퍼샌드("&")가 문서에 나오자 이를 문자 개체 참조가 시작되는 것으로 인식하게 된다는 것이다.
브라우저들은 이러한 종류의 오류를 안전하게 복구하여 주지만 다음과 같은 상황도 발생할 수 있다.

예를 들어 많은 브라우저들은 &copy=3 을 ©=3으로 변환하므로 이로 인해 의도하지 않은 링크로 변경이 되는 것이다.

다른 예로 &lang은 왼쪽 방향 꺽쇠를 나타내는 HTML entity이므로 몇몇 브라우저에서는 &lang=en 을 &lang=en로 변환한다.

그리고 대부분의 브라우저에서는 &sect=2를 §=2로 변환한다.

결국 위에 예를 든 링크는 아래와 같은 링크로 변환이 된다.(브라우저 마다 차이가 있다.)
<a href="foo.cgi?chapter=1§ion=2©=3&⟨=en">…</a>

문자 개체 참조의 시작으로 인식하는 오류 및 의도하지 않은 문서의 변형을 피하기 위해선 항상 URL에 "&"을 "&amp;" 로 변경하여 주면 되는 것이다.

데모

참고