HTML의 dirname 속성을 사용하면 폼을 제출할 때 입력 필드의 텍스트 방향(text direction) 정보를 함께 전송할 수 있습니다. 이 속성은 특히 아랍어나 히브리어처럼 오른쪽에서 왼쪽으로 쓰는 언어(RTL)와 영어처럼 왼쪽에서 오른쪽으로 쓰는 언어(LTR)를 동시에 지원해야 하는 다국어 웹사이트에서 매우 유용합니다.
dirname 속성의 동작 원리
폼이 제출될 때 전송되는 값은 해당 입력 필드의 name 값 뒤에 ".dir"이 붙은 형태입니다. 예를 들어 name="sname", dirname="sname.dir"로 설정했다면, 실제 제출 시 "sname.dir=ltr" 또는 "sname.dir=rtl" 같은 데이터가 함께 전달됩니다.
예제
다음 코드를 실행하면 dirname 속성이 실제로 어떻게 작동하는지 직접 확인할 수 있습니다.
<!DOCTYPE html> <html> <body> <h2>Student Contact Form</h2> <form action = "mailto:emailid@example.com" method = "post" enctype = "text/plain"> Student Name:<br><input type = "text" name = "sname" dirname = "sname.dir"> <br> Student Subject:<br><input type = "text" name = "ssubject"><br> <input type = "submit" value = "Send"> </form> </body> </html>
참고 사항
- 적용 대상:
<input>요소와<textarea>요소에서 사용할 수 있습니다. - 브라우저 지원: Chrome, Edge, Safari 등 대부분의 최신 브라우저에서 지원합니다. Firefox는 비교적 최근 버전부터 지원했으므로, 프로젝트에 적용하기 전 대상 브라우저의 호환성을 확인하는 것이 좋습니다.
- 서버 활용: 서버 측에서는 전송된 방향 정보(ltr/rtl)를 참고해 사용자가 입력한 텍스트를 올바른 방향으로 저장하고 화면에 렌더링할 수 있습니다.