HTML DOM Anchor username คุณสมบัติ

คุณสมบัติชื่อผู้ใช้สมอ HTML DOM ที่เชื่อมโยงกับแท็กสมอใช้เพื่อตั้งค่าหรือส่งคืนค่าของส่วนชื่อผู้ใช้ของแอตทริบิวต์ href ชื่อผู้ใช้ถูกป้อนโดยผู้ใช้และมักใช้ในคู่ชื่อผู้ใช้กับรหัสผ่าน ค่าชื่อผู้ใช้ถูกระบุหลังโปรโตคอลและก่อนส่วนรหัสผ่านของลิงก์

ไวยากรณ์

ต่อไปนี้เป็นไวยากรณ์สำหรับ −

ส่งคืนคุณสมบัติชื่อผู้ใช้ -

anchorObject.username

การตั้งค่าคุณสมบัติชื่อผู้ใช้ -

anchorObject.username = UsernameValue

ตัวอย่าง

ให้เราดูตัวอย่างคุณสมบัติชื่อผู้ใช้สมอ -

<!DOCTYPE html>
<html>
<body>
<p><a id="Anchor"href="https://john:[email protected]">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 Anchor username คุณสมบัติ

เมื่อคลิก “ตั้งค่าผู้ใช้” −

HTML DOM Anchor username คุณสมบัติ

เมื่อคลิก "รับผู้ใช้" -

HTML DOM Anchor username คุณสมบัติ

ในตัวอย่างข้างต้น −

เราได้เชื่อมโยงชื่อผู้ใช้เป็น john และรหัสผ่าน john123 แล้ว

<p><a id="Anchor" href="https://john:[email protected]">ExampleSite</a></p>

จากนั้นเรามีปุ่ม "Set User" และ "Get User" สองปุ่มเพื่อดำเนินการฟังก์ชัน changeUser() และ GetUser() ตามลำดับ

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

ฟังก์ชัน changeUser() จะเปลี่ยนชื่อผู้ใช้ที่ระบุในลิงก์ไปยังชื่อผู้ใช้ที่เราระบุ “โรฮัน” ในกรณีของเรา ฟังก์ชัน GetUser() รับชื่อผู้ใช้จากลิงก์ที่มี id Anchor ที่เชื่อมโยงกับมัน และส่งคืน “Rohan” เฉพาะเมื่อมีการเรียก changeUser() ก่อน GetUser() มิฉะนั้น จะเป็น “john”

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