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

HTML DOM 앵커 유형 속성

<시간/>

앵커 태그와 연결된 HTML DOM 유형 속성은 링크의 유형 속성 값을 설정하거나 가져오는 데 사용됩니다. 이 속성은 HTML 5에서 도입되었습니다. 이 속성은 또한 암시적인 이유일 뿐이며 반드시 포함해야 하는 것은 아닙니다. 단일 MIME(Multipurpose Internet Mail Extensions) 값 유형을 포함합니다.

구문

다음은 −

의 구문입니다.

유형 속성 반환 -

anchorObject.type

유형 속성 설정 -

anchorObject.type = MIME-type

예시

앵커 텍스트 속성의 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<body>
<p><a id="Anchor" type="text/html" href="https://www.examplesite.com">example site</a></p>
<p><a id="Anchor2" href="https://www.example.com">example</a></p>
<p>Click the buttons to set and get the type attribute.</p>
<button onclick="getType1()">GetType</button>
<button onclick="setType2()">SetType</button>
<p id="Type1"></p>
<script>
   function getType1() {
      var x = document.getElementById("Anchor").type;
      document.getElementById("Type1").innerHTML = x;
   }
   function setType2(){
      document.getElementById("Type1").innerHTML="Type has been set";
      document.getElementById("Anchor2").type="text/html";
   }
</script>
</body>
</html>

출력

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

HTML DOM 앵커 유형 속성

GetType 버튼 클릭 시 -

HTML DOM 앵커 유형 속성

SetType 버튼 클릭 시 -

HTML DOM 앵커 유형 속성

위의 예에서 -

우리는 각각 id Anchor와 Anchor2로 두 개의 링크를 가져왔습니다. Anchor1에는 연결된 MIME 유형 text/html이 있는 반면 Anchor2에는 연결된 MIME 유형이 없습니다.

<p><a id="Anchor" type="text/html" href="https://www.examplesite.com">example site</a></p>
<p><a id="Anchor2" href="https://www.example.com">example</a></p>

그런 다음 GetType1() 및 getType2() 함수를 각각 실행하는 두 개의 GetType 및 SetType 버튼이 있습니다.

<button onclick="getType1()">GetType</button>
<button onclick="setType2()">SetType</button>

getType1() 함수는 id가 "Anchor"인 앵커 태그의 유형을 반환합니다. setType2() 함수는 id가 "Anchor2"인 앵커 태그의 유형을 text/html로 설정합니다.

function getType1() {
   var x = document.getElementById("Anchor").type;
   document.getElementById("Type1").innerHTML = x;
}
function setType2(){
   document.getElementById("Type1").innerHTML="Type has been set";
   document.getElementById("Anchor2").type="text/html";
}