HTML5新添了一些语义化标签,他们能让代码语义化更直观易懂,有利于SEO优化。但是此HTML5新标签在IE6/IE7/IE8上并不能识别,需要进行JavaScript处理。

解决思路就是用js创建html5中的新标签,代码如下:

<script>
(function() {
if (!
/*@cc_on!@*/
0) return;
var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');
var i= e.length;
while (i--){
document.createElement(e[i])
}
})()
</script>

对于上面的代码要初始化新标签的CSS.因为HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素方便布局。

另外对于代码中if (!  /*@cc_on!@*/ 0) return;是什么意思大多数人会有困惑,主要是用于判断浏览器是否支持注释条件编译。在Internet Explorer 11标准模式和Windows应用商店应用中不支持条件编译。 在Internet Explorer 10标准模式和所有早期版本中支持条件编译。这样非IE浏览器就会忽视这段代码,也就不会有无谓的http请求了。

ie8以下不兼容h5新标签的解决方法的更多相关文章

  1. 让ie浏览器支持html5新标签的解决方法(使用html5shiv)

    没估计错的话旧版浏览器都是不识别这些新增的标签所以都是用行内元素来处理解决的,所以,有一个解决办法的突破口就是让它变成块状元素就不会处于同一行了,这样在新旧浏览器都是可以显示同样的效果,再者就是让浏览 ...

  2. 解决IE7兼容H5新标签的方法

    外部引入JS <script src="http://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script&g ...

  3. H5新标签(适合新手入门)

    H5新标签 文档类型设定 document HTML: sublime 输入 html:4s XHTML: sublime 输入 html:xt HTML5 sublime 输入 html:5 < ...

  4. H5新标签

    1. H5新标签 语义标签: <article>定义文章</article><aside>定义文章侧边栏</aside> <figure>定 ...

  5. 完美解决ie8以下不兼容h5的方法

    HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单. HTML5的新标签元素有: <header&g ...

  6. 处理H5新标签方法

    语义化 HTML5中加入了更加具有语义化的标签,比如header,nav,footer等,可以为搜索引擎优化,让爬虫能更好地理解网页结构. 但是对于新标签的兼容性不是很好,IE9以下旧版本不支持新的语 ...

  7. 前端基础小标签3 H5新标签

    第二部分H5的新标签一.<!-- mark标签             1.用于显示页面中需要重点关注的内容,就像看书需要用荧光笔划重点一样             2.浏览器通常会用黄色显示m ...

  8. h5新增加的存储方法

    h4中使用的cookie把用户信息保存在客户端浏览器,但是它受到很多限制. 大小:最多能存储4k 带宽:它是随着http请求一起发送到服务器的,因此浪费一部分的带宽. 复杂度:操作复杂. h5新增加了 ...

  9. CSS兼容IE Firefox问题与解决方法

    一.双边距问题浮动元素的外边距会加倍,但与第一个浮动元素相邻的其他浮动元素外边距不会加倍.解决方法:在此浮动元素增加样式  display:inline; 二.图片产生的间隙父元素直接包含<im ...

随机推荐

  1. 剑指offer——73股票的最大利润

    题目: 假设把某股票的价格按照时间先后顺序存储在数组中,请问买卖该股票一次可能获得的最大利润是多少?例如,一只股票在某些时间节点的价格为{9,11,8,5,7,12,16,14}.如果我们能在价格为5 ...

  2. Java传输对象模式

    当我们想要在客户端到服务器的一个传递具有多个属性的数据时,可使用传输对象模式.传输对象也称为值对象.传输对象是一个具有getter/setter方法的简单POJO类,并且是可序列化的,因此可以通过网络 ...

  3. static变量、static函数与普通变量、普通函数的区别

    转自:http://blog.163.com/sunshine_linting/blog/static/44893323201191294825184/ 全局变量(外部变量)的说明之前再冠以stati ...

  4. SpringCloud+Eureka+Feign+Ribbon+zuul的简化搭建流程和CRUD练习

    环境:win10--idea2019--jdk8 1.搭建Eureka服务模块 1.1 新建eureka服务模块(Sping Initializr) 取名为eureka-server,并添加如下Dep ...

  5. [原创] delphi Memo 滚动到底部/开始 [Delphi XE、Delphi 7]

    以前控制Memo滚动到底部的操作: SendMessage(memo1.Handle,WM_VSCROLL,SB_BOTTOM,0); 或者 Memo1.SelLength:=Length(Memo1 ...

  6. NX二次开发-UFUN文件选择对话框UF_UI_create_filebox

    NX11+VS2013 #include <uf.h> #include <uf_ui.h> UF_initialize(); //文件选择对话框 char sPromptSt ...

  7. 2018-2019-2-20175323 java实验二《Java面向对象程序设计》

    单元测试 1.在IDEA中新建项目并输入单元测试的代码 2.在IDEA中下载Junit,我发现Junit已经存在了 3.新建test文件 遇到的问题 发现Junit红字解析不了 解决办法:查找到jun ...

  8. ViewGroup全面分析

    转:http://www.cnblogs.com/lqminn/archive/2013/01/23/2866543.html 一个Viewgroup基本的继承类格式如下: 1 import andr ...

  9. 牛客多校第八场 G Gemstones 栈/贪心

    题意: 对于一个序列,把可以把连着三个相同的字母拿走,问最多拿走多少组. 题解: 直接模拟栈,三个栈顶元素相同则答案+1,并弹出栈 #include<bits/stdc++.h> usin ...

  10. Vue.js - 路由 vue-router 的使用详解2(参数传递)

    一.使用冒号(:)的形式传递参数 1,路由列表的参数设置 (1)路由列表的 path 是可以带参数的,我们在路由配置文件(router/index.js)里以冒号的形式设置参数. (2)下面样例代码中 ...