Computer >> 컴퓨터 >  >> 프로그램 작성 >> HTML

HTML DOM Bdo 디렉토리 속성

<시간/>

HTML DOM Bdo dir 속성은 HTML 요소와 연결됩니다. 여기서 bdo는 양방향 재정의를 나타냅니다. 태그는 기본적으로 왼쪽에서 오른쪽인 현재 텍스트 방향을 재정의하는 데 사용됩니다. bdo dir 속성은 요소의 dir 속성 값을 설정하거나 반환합니다. dir 속성은 요소에 필수입니다. 텍스트 흐름의 방향을 지정합니다.

구문

다음은 −

의 구문입니다.

dir 속성 설정하기 -

bdoObject.dir = "ltr|rtl"

여기서 ltr은 왼쪽에서 오른쪽 텍스트 방향이고 rtl은 오른쪽에서 왼쪽 텍스트 방향입니다.

dir 속성 반환 -

bdoObject.dir

예시

HTML DOM bdo dir 속성에 대한 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<body>
<h3><bdo id="myBdo" dir="rtl">RIGHT-TO-LEFT</bdo></h3>
<p>Click the below button to get text direction of the above text</p>
<button onclick="getDirection()">GET DIRECTION</button>
<button onclick="setDirection()">SET DIRECTION</button>
<p id="Sample"></p>
<script>
   function getDirection() {
      var x = document.getElementById("myBdo").dir;
      document.getElementById("Sample").innerHTML ="The text direction is from " + x;
   }
   function setDirection(){
      document.getElementById("myBdo").dir="ltr";
   }
</script>
</body>
</html>

출력

이것은 다음과 같은 출력을 생성합니다 -

HTML DOM Bdo 디렉토리 속성

GET DIRECTION 클릭 시 -

HTML DOM Bdo 디렉토리 속성

SET DIRECTION 클릭 시 -

HTML DOM Bdo 디렉토리 속성

위의 예에서 -

먼저 내부에 요소를 생성했습니다.

dir 속성 값이 "rtl"로 설정된 요소 -

<h3><bdo id="myBdo" dir="rtl">RIGHT-TO-LEFT</bdo></h3>

그런 다음 getDirection() 및 setDirection() 함수를 각각 실행하기 위해 두 개의 GET DIRECTION 및 SET DIRECTION 버튼을 만들었습니다. -

<button onclick="getDirection()">GET DIRECTION</button>
<button onclick="setDirection()">SET DIRECTION</button>

getDirection() 함수는 우리의 경우 요소인 id "myBdo"와 관련된 요소를 가져옵니다. 그런 다음 요소에서 얻은 dir 속성 값이 변수 x에 할당됩니다. 값은 id가 "Sample"과 연결된 단락에 표시됩니다. -

function getDirection() {
   var x = document.getElementById("myBdo").dir;
   document.getElementById("Sample").innerHTML ="The text direction is from " + x;
}

setDirection() 함수는 id "mybdo"로 요소를 가져오고 dir 속성 값을 왼쪽에서 오른쪽을 의미하는 "ltr"로 설정합니다. 기본 텍스트 방향이기도 합니다. -

function setDirection(){
   document.getElementById("myBdo").dir="ltr";
}