Computer >> Máy Tính >  >> Lập trình >> HTML

Đối tượng HTML DOM Kbd

Đối tượng Kbd đại diện cho một phần tử nội tuyến hiển thị phông chữ monospace theo mặc định.

Cú pháp

Sau đây là cú pháp -

Tạo phần tử

var kbdObject = document.createElement(“KBD”)

Ví dụ

Hãy để chúng tôi xem một ví dụ cho Kbd phần tử đối tượng -

<!DOCTYPE html>
<html>
<head>
<title>Kbd Object</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>Kbd Object</legend>
<label for="textSelect">Keyboard Input: </label>
<input id="textSelect" type="text" placeholder="John Doe">
<input type="button" onclick="convertKBD()" value="Check">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var textSelect = document.getElementById("textSelect");
   function convertKBD() {
      var kbdObject = document.createElement("KBD");
      var kbdText = document.createTextNode(textSelect.value);
      kbdObject.appendChild(kbdText);
      divDisplay.appendChild(kbdObject);
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Trước khi nhấp vào ‘Kiểm tra’ nút -

Đối tượng HTML DOM Kbd

Sau khi nhấp vào ‘Kiểm tra’ nút -

Đối tượng HTML DOM Kbd