Textarea_HTML/Xhtml_Web 페이지 제작 이용 시 주의사항

특히 텍스트 영역을 언급하는 이유는 무엇입니까? 실제로 textarea 노드는 매우 특별하기 때문입니다. 이 노드는 특별하기 때문에 IE와 다른 브라우저에서는 다르게 해석됩니다.

한번 해보세요, 하하! 사실, 주된 이유는 오늘 선배가 BUG를 고치는 것을 돕기 위한 것입니다. 특히 서버에서 가져와서 텍스트 영역에 삽입한 데이터가 IE에서만 발생하기 때문입니다. 다른 브라우저에서는 모든 것이 잘 작동합니다!

먼저 텍스트 영역이 왜 특별한가요? 모든 형태의 플러그인에서 textarea의 값은 두 개의 여는 태그와 닫는 태그 사이에 기록되므로 해당 값은 textarea에 고유한 DOM 관점에서 텍스트 노드로 간주될 수 있습니다. 이 기능으로 인해 innerHTML 값을 수정할 때 텍스트 영역의 텍스트를 변경할 수 있습니다. IE는 이를 지원하지만 일부 html 태그를 동적으로 삽입하는 것은 허용하지 않습니다.

실험해 볼 수도 있습니다.

value나 innerText 대신 innerHTML 속성을 사용하여 IE에서 JS를 통해 HTML 코드 조각을 삽입하세요.

IE9는 테스트하지 않았지만 IE6, 7, 8에서는 모두 오류가 보고됩니다.

보안상의 이유로 JS에서는 html을 텍스트 영역에 동적으로 삽입하는 것이 허용되지 않는 것으로 추정되지만, 주의깊은 사람들은 실제로 html 코드를 수동으로 입력하면 텍스트 영역이 허용된다는 것을 알 수 있습니다. 내 생각에 이것은 실제로 문자 탈출이라는 과정을 거치는 것 같습니다. 예, 이것이 HTML 코드를 수동으로 입력하는 성공을 설명할 수 있는 유일한 이유입니다.

그럼 제 생각에는 수많은 브라우저의 텍스트 영역이 html 표시를 지원하지 않는데 JS를 운영할 때 왜 innerHTML 속성을 사용해야 할까요? 즉, html 코드를 삽입하기 위해 value를 사용하든, html 코드를 삽입하기 위해 innerHTML을 사용하든, 구문 분석 및 표시되지 않습니다(그래서 텍스트 영역 대신 리치 텍스트 편집기가 있는 것입니다). 따라서 value를 사용하여 값을 설정하는 것은 어떨까요? 텍스트 영역?

그래서 텍스트 영역의 값은 innerHTML을 통해 설정하면 안 되고(물론 Firefox에서는 innerText가 불가능하지만) 값을 통해 설정해야 한다고 생각합니다. 개발자가 주목해야 할 부분입니다. 최근에 본 아동화 코드 중 일부는 항상 innerHTML을 사용하는 것을 좋아하기 때문입니다. 사실 모든 것은 상황에 달려 있다고 생각합니다.