浏览器对HTML属性的支持_优品建站

浏览器对HTML属性的支持

  对于HTML开发设计人员来讲,浏览器的兼容性是一个复杂又不可回避的问题。随着技术的进步,目前市面上的主流浏览器对HTML的支持已经很完善了,不像早期浏览器的兼容性那样,让开发设计人员伤透了脑筋。
  本节介绍浏览器对HTML属性的支持问题,包括对最新的HTML 5属性的支持。HTML 5是一个全新的标准,增加了很多新的特性,对多媒体的支持更全面。因此,浏览器对HTML 5属性的支持也是判断其兼容性的重要指标。
  下面看一段判断浏览器是否支持HTML某个属性的代码(参见源代码ch02/ch02-html-support-prop.html文件)。
【代码2-13】

【代码解析】
  第14~18行代码定义了一个JavaScript脚本函数isSupport(prop)。其中,第16行代码通过createElement()函数方法创建一个div标签元素,并使用in方法将对属性的判断结果进行返回。
  第29行代码定义了一个包含6个常用的HTML属性的数组“prop”。
  第30~32行代码通过for循环语句依次判断数组“prop”中的属性是否为div标签元素所支持,具体是通过isSupportProp()函数方法来判断的。
  第33~42行代码是isSupportProp()函数方法的实现过程,在该函数方法内部通过调用第14~18行代码定义的isSupport(prop)函数方法来实现判断。
  运行测试网页,效果如图2.16所示。层(div)标签元素是支持“id”、“style”和“title”属性的,而“name”、“type”和“value”属性是不支持的。
图2.16 HTML常用属性判断结果
  下面看一段判断浏览器是否支持HTML 5属性的代码(参见源代码ch02/ch02-html-support-HTML 5.html文件)。
【代码2-14】
【代码解析】
  在这段代码中,判断浏览器是否支持HTML 5属性主要是使用了Web Worker属性。第05行代码通过typeof()方法判定Worker属性是否未定义("undefined"),如果定义了则判定浏览器支持HTML 5属性。
  下面使用最新版的FireFox浏览器(v.50.0.2版)运行测试该页面,其效果如图2.17所示。可以看出,新版FireFox浏览器对HTML 5是支持的。
  下面再使用最新版的Microsoft Edge浏览器(Windows 10预览版自带)运行测试这个页面,其效果如图2.18所示。从中看到,Microsoft Edge浏览器对HTML 5也是支持的。看来不支持HTML 5的浏览器只有早期Windows XP系统下的IE6、IE7和IE8浏览器了。
图2.17 判断FireFox浏览器是否支持HTML 5

图2.18 判断Microsoft Edge浏览器是否支持HTML 5

优品建站免费提供网站制作报价服务

  • html5实例:改进“About Me”页面
    本文我们将试着给“About Me”页面进行修改完善。
  • html5+css3+javascript实用案例:分组标签制作联系方式
    本案例将实现明日学院网站的“联系我们”页面。将介绍<div>和<span>分组标签,对页面的内容进行分类分组处理。下面将详细介绍<div>标签和<span>标签。
  • HTML5案例实战:访问用户位置的方法和应用技巧
    由于国家网络限制,内地访问谷歌地图不是很顺畅,建议读者选用高德地图或百度地图开发API,也可以直接使用本书提供的用户key(http://lbs.amap.com/)进行上机练习。
  • html+css实用案例:实现素材图片效果
    应用本章所学的CSS相关属性,使用素材图片,借助background-position实现“联系我们”页面。
  • html5的<audio>标签和<video>标签
    在HTML5中,新增了两个标签——<video>标签与<audio>标签。<video>标签专门用来播放网络上的视频或电影,而<audio>标签则专门用来播放网络上的音频数据。
  • html5网站制作实例:改进“About Me”页面
    我们已经了解了微格式和微数据这两个语义流派的基本结构。以此为起点,大家可以自己(到http://microformats.org)去找新的微格式,或者(到http://schema.org)去找微数据词汇表,从头开始编写富有语义的标记。
  • HTML5提供网站制作的表单验证属性
    HTML5为表单验证提供了极大的方便,在验证表单的方式上显得更加灵活。表单验证,首先会基于前面讲解的表单类型的规则进行验证;其次是为表单元素提供了一些用于辅助表单验证的属性。
  • 主流浏览器对CSS3支持状况
    CSS3特性大部分都已经有了很好的浏览器支持度(后面在讲每个CSS3特性之时,会列出各浏览器对其支持情况)。
  • 浏览器对HTML5语义元素的支持情况
    HTML5的这些语义元素已经基本得到了所有现代浏览器的支持。就算你想找到一个不支持它们的Chrome、Firefox、Safari或Opera的版本,都不太可能。最大的绊脚石还是IE9之前的Internet Explorer,包括仍然占很大比例的IE8。
  • html网站制作refresh重定向
    本节介绍refresh重定向的概念及用法,其在HTML网页中有着非常特殊的作用。
  • 网站制作 服务

    免费网站制作报价,免费优化,1对1服务,个性化定制服务

    pc和wap网站制作

    多年建站经验,上千个成功案例,
    为您提供一站式服务

    网站维护改版

    大厂经验工程师对现有网站进行
    改版,修复,维护。

    小程序制作

    微信小程序,支付宝小程序,
    百度小程序

    响应式网页设计

    响应式网页设计可以与多种设备兼容,
    如智能手机,平板电脑和PC