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

HTML DOM 앵커 사용자 이름 속성

<시간/>

앵커 태그와 연결된 HTML DOM 앵커 사용자 이름 속성은 href 속성의 사용자 이름 부분 값을 설정하거나 반환하는 데 사용됩니다. 사용자 이름은 사용자가 입력하며 종종 사용자 이름-비밀번호 쌍에 사용됩니다. 사용자 이름 값은 프로토콜 뒤와 링크의 비밀번호 부분 바로 앞에 지정됩니다.

구문

다음은 −

의 구문입니다.

사용자 이름 속성 반환 -

anchorObject.username

사용자 이름 속성 설정 -

anchorObject.username = UsernameValue

예시

앵커 사용자 이름 속성의 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<body>
<p><a id="Anchor"href="https://john:john123@www.examplesite.com">ExampleSite</a></p>
<p>Click the button to change username</p>
<button onclick="changeUser()">Set User</button>
<button onclick="GetUser()">Get User</button>
<p id="Sample"></p>
<script>
   function changeUser() {
      document.getElementById("Anchor").username = "Rohan";
   }
   function GetUser() {
      var x=document.getElementById("Anchor").username;
      document.getElementById("Sample").innerHTML = x;
   }
</script>
</body>
</html>

출력

다음 출력을 생성합니다 -

HTML DOM 앵커 사용자 이름 속성

"사용자 설정" 클릭 시 -

HTML DOM 앵커 사용자 이름 속성

"사용자 가져오기"를 클릭하면 -

HTML DOM 앵커 사용자 이름 속성

위의 예에서 -

사용자 이름이 john이고 비밀번호가 john123인 링크를 가져왔습니다.

<p><a id="Anchor" href="https://john:john123@www.examplesite.com">ExampleSite</a></p>

그런 다음 각각 changeUser() 및 GetUser() 기능을 실행하기 위한 두 개의 "사용자 설정" 및 "사용자 가져오기" 버튼이 있습니다.

<button onclick="changeUser()">Set User</button>
<button onclick="GetUser()">Get User</button>

changeUser() 함수는 링크에 지정된 사용자 이름을 당사가 지정한 사용자 이름으로 변경합니다. 우리의 경우 "Rohan". GetUser() 함수는 연결된 id Anchor가 있는 링크에서 사용자 이름을 가져오고 ChangeUser()가 GetUser() 전에 호출된 경우에만 "Rohan"을 반환합니다. 그렇지 않으면 "john"이 됩니다.

function changeUser() {
   document.getElementById("Anchor").username = "Rohan";
}
function GetUser() {
   var x=document.getElementById("Anchor").username;
   document.getElementById("Sample").innerHTML = x;
}