HTML5中datalist标签有什么用-创新互联

这篇文章主要为大家展示了HTML5中datalist标签有什么用,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带大家一起来研究并学习一下“HTML5中datalist标签有什么用”这篇文章吧。

创新互联是一家专注于网站设计制作、成都做网站与策划设计,叙州网站建设哪家好?创新互联做网站,专注于网站建设十年,网设计领域的专业建站公司;建站业务涵盖:叙州等地区。叙州做网站价格咨询:18982081108

html有什么特点

1、简易性:超级文本标记语言版本升级采用超集方式,从而更加灵活方便,适合初学前端开发者使用。 2、可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证。  3、平台无关性:超级文本标记语言能够在广泛的平台上使用,这也是万维网盛行的一个原因。 4、通用性:HTML是网络的通用语言,它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。


datalist标签:
datalist介绍:
datalist一般不会独行江湖,它需要与input标签的搭配使用,就像label标签与input标签搭配使用一样。既然与input标签搭配使用,那么这两个标签之间必定存在着“特殊的关系”,不然input与datalist就互不相认了,那么如何才能让他们建立起来这种关系呢?这个时候我们需要一个新的属性list(注意,不是for),list与for的用法一样,list的值设置为表单元素的 id,这样他们便会自动关联了。
Chrome对此标签支持不好,Firefox和Opera可很好的支持
datalist作用:
我们经常在网上的搜索框中看到当输入一个字符,输入框下方会自动列出你输入的关键词,比如Google或百度的搜索,如下图:                                                                                  HTML5中datalist标签有什么用

此效果非HTML5的datalist技术实现

datalist案例:



        
        
        
        
        
        
        

datalist说明:
个人认为称呼datalist为自动补全列表更加合适,因为它并不是下拉列表。

以上就是关于“HTML5中datalist标签有什么用”的内容,如果改文章对你有所帮助并觉得写得不错,劳请分享给你的好友一起学习新知识,若想了解更多相关知识内容,请多多关注创新互联行业资讯频道。


标题名称:HTML5中datalist标签有什么用-创新互联
文章URL:http://pwwzsj.com/article/jgjdg.html