常见的meta标签、webview中和原生交互以及swiper的使用

2018-03-15

页面中无交互和app(andriod,ios)传递信息

加入meta标签即可,app端可以获取到meta标签的内容（可用于内嵌页于app中的分享信息的传递）;
1
<meta name='shareTitle' content="message">

使用swiper时候遇上的坑(官方文档)

当swiper中包含图片且图片是异步动态加载的时候，初始化swiper的时候添加observer属性即可

var mySwiper = new Swiper('.swiper-container', {
    direction: 'horizontal',
    autoHeight: true,
    observer: true,
    observeParents: true,
  });

2.当swiper是嵌套在tap切换的时候，会导致swiper失效（swiper官方文档说加上observer属性即可，但我试了没用，可能我的tab切换并没有多个div，而是同一个div改变的数据的原因）

//在切换的时候摧毁上一个swiper实例，新建另一个实例即可
var swpierTab = null;
$("tab").click(function(){
    if (swpierTab){
        swpierTab.destroy()
    }
    swpierTab = new Swiper('.swiper-container', {
        direction: 'horizontal',
        autoHeight: true,
        observer: true,
        observeParents: true,
     });
})

常用的meta标签

<!--属性为name-->
<!--网站信息描述类型-->
<meta name="keywords" content="关键字" />
<meta name="description" content="网站描述" />
<meta name="author" content="网站作者" />
<!--视口标签定义用户是否能缩放，网页的缩放比之类的-->
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<!--双核浏览器的渲染方式-->
<meta name="renderer" content="webkit/ie-comp/ie-stand" />
<!--定义referrer策略-->
<meta name="referrer" content="no-referrer|origin|no-referrer-when-downgrade|origin-when-crossorigin|unsafe-url" />
<!--忽略识别电话和邮箱-->
<meta name="format-detection" content="telephone=no" /> //忽略数字自动识别为电话号码
<meta name="format-detection" content="email=no" /> //忽略识别邮箱

<!--属性为http-equiv-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />   //旧的HTML，不推荐
<meta charset="UTF-8" >   //HTML5设定网页字符集的方式
<!--用于告知浏览器以何种版本渲染当前页面-->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />   //优先使用IE最新版本和Chrome
<!--禁止浏览器从本地计算机的缓存中访问页面内容-->
<meta http-equiv="Pragma" content="no-cache" />
<!--让网页在一定的时间内刷新自己，或者在多长时间后跳转到其他网页-->
 <meta http-equiv="refresh" content="30" >   //30s后刷新自己
 <meta http-equiv="refresh" content="30;URL="http://www.baidu.com" >   //30s后跳转到百度
 <!--expires：指定网页的过期时间，过期后必须重新请求服务器-->
<meta http-equiv="expires" content="Sat, 29 Apr 2017 04:25:02 GMT" >