弱特征广告展示思路初步实现基本思路：

  1. 简单性，以前直接写在页面中的HTML结构广告要能低成本的改造；
  2. 用基本的HTML结构和Style标签作为数据结构，方便后续广告系统的开发和使用，实现基本的可视方案；
  3. 通过函数参数简化数据传输；
  4. 下载链接的配置参考AppLink。

HTML部分

<script type="am-template" id="am-header">
<style>
.am-header {
}
.am-header .am-header-logo {
}
.am-header .am-header-title {
}
.am-header .am-join {
}
</style>
<div class="am-header">
    <div class="am-header-logo">
        <div class="am-header-title">Title</div>
        <p>Slogan</p>
    </div>
    <a class="am-join" href="#">立即打开</a>
    <a class="am-join" 
        href="download-link"                         // 服务器端设置的根据UA判断的自动跳转链接，包含下面4中情况
        data-href-android="android-download-link"    // Android包下载地址
        data-href-ios="itunes-link"                  // itunes地址
        data-href-qq-android="myapp-link"            // 应用宝推广地址
        data-href-qq-ios="myapp-link"                // 应用宝推广地址
        data-deeplink="deep-link"                    // 跳转App地址
    >立即打开</a>
</div>
</script>
<script>
one.am(document.querySelector('#am-header').innerHTML);
</script>

CSS部分

iframe {
    width: 100%;
    border: none;
}

JS部分