HTML | DOM 输入 URL 对象

HTML DOM 中的 Input URL 对象表示具有 type = “url” 属性的 元素。可以使用 getElementById() 方法访问类型为 url 的元素。

句法：

document.getElementById("id");

其中 id 分配给 标签。

属性值：

• list：返回包含 URL 字段的数据列表的引用。
• form：它返回包含 URL 字段的表单的引用。
• autocomplete：用于设置或返回 URL 字段的 autocomplete 属性的值。
• autofocus：用于设置或返回页面加载时 URL 字段是否应自动获得焦点。
• defaultvalue：用于设置或返回 URL 字段的默认值。
• disabled：用于设置或返回URL字段是否禁用。
• maxLength：用于设置或返回 URL 字段的 maxlength 属性值。
• name：用于设置或返回 URL 字段的 name 属性值。
• pattern：用于设置或返回URL字段的pattern属性值。
• placeholder：用于设置或返回URL字段的placeholder属性的值。
• readOnly：用于设置或返回 URL 字段是否为只读。
• required：用于设置或返回在提交表单前是否必须填写URL字段。
• size：用于设置或返回URL字段的size属性值。
• type：它返回 URL 字段所属的表单元素的类型。
• value：用于设置或返回 URL 字段的 value 属性的值。

示例 1：

 
 
     
        
            DOM Input URL Object 
        
     
      
     
         
             
                GeeksForGeeks 
             
              
            DOM Input URL Object 
                  
            
                Enter URL
            
              
            
              
            
                  
             
                Click
             
              
            
              
             
                function geeks() { 
                    var link = document.getElementById("gfg").value; 
                    document.getElementById("GFG").innerHTML = link;
                } 
             
        
     
                    

输出：
点击按钮前：

点击按钮后：

示例 2：

 
 
     
        
            DOM Input URL Object
        
     
      
     
         
            GeeksForGeeks 
         
              
        DOM Input URL Object  
                  
        
            Enter URL
        
  
         
            Click
         
              
        
              
         
            function myGeeks() { 
                var link = document.createElement("INPUT");
                link.setAttribute("type", "url");
                link.setAttribute("value", "http://www.geeksforgeeks.org");
                document.body.appendChild(link);
            } 
         
     
                    

输出：
点击按钮前：

点击按钮后：