HTML DOM Input Tel用法及代碼示例

HTML DOM 中的輸入 Tel 對象用於表示 type= “tel” 的 HTML 輸入元素。 type= “tel” 的輸入元素可以使用getElementById() 方法訪問。

用法:

它用於訪問輸入電話對象。

document.getElementById("id");

它用於創建輸入元素

document.createElement("input");

示例 1：下麵的 HTML 代碼說明了如何訪問輸入電話對象。

HTML


<!DOCTYPE html>
<html>
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>
    <h2>DOM Input Tel Object</h2>
    <input type="tel" id="mytel" value="6753682635">
     
<p>Click the button to get the
        phone number of the Input Tel field.</p>
    <button onclick="myFunction()">
        Click Here!
    </button>
    <p id="demo"></p>
    <script>
        function myFunction() {
            // Accessing input value
            var x =
                document.getElementById("mytel").value;
            document.getElementById(
                "demo").innerHTML = x;
        }
    </script>
</body>
</html>

輸出：

示例 2：下麵的 HTML 代碼用於創建輸入電話對象。

HTML


<!DOCTYPE html>
<html>
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>
    <h2>DOM Input Tel Object</h2>
     
<p>Click the button to create a input tel field.</p>
    <button onclick="myFunction()">Click Here!</button> <br>
    <br>
    <script>
        function myFunction() {
            // Creating input element.
            var x = document.createElement("INPUT");
            x.setAttribute("type", "tel");
            x.setAttribute("value", "8976353828");
            document.body.appendChild(x);
        }
    </script>
</body>
</html>

輸出：

支持的瀏覽器：

穀歌瀏覽器 3+
火狐瀏覽器
邊 12+
野生動物園 4+
Opera 11+

相關用法

注：本文由純淨天空篩選整理自ManasChhabra2大神的英文原創作品 HTML DOM Input Tel Object。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。