微信小程序资料总结

http://blog.csdn.net/ZCLengendary/article/details/54312030  --添加html标签与处理

https://www.cnblogs.com/HDK2016/p/6285320.html --正则表达式

https://www.w3cschool.cn/ --w3cschool

<span style="font-size:18px;"> <span style="white-space:pre;">  </span>//替换标签中特殊字符 这里观察返回数据找到非 HTML 字符串,随后将该字符串替换成空字符串.
        var infoFlg = "<!--SPINFO#0-->";
        if (content.indexOf(infoFlg) > ) {
         content = content.replace(/<!--SPINFO#-->/, "");
        }</span> 

下面是实例

js代码如下

<span style="font-size:18px;">var WxParse = require('../../wxParse/wxParse.js');  

Page({  

  data: {
  },  

onLoad: function(options) {  

    //http://c.m.163.com/nc/article/CADGA4VH0001875N/full.html
    var self = this;
    var optionId = options.id;
    console.log(optionId);
    wx.request( {
      url: 'http://c.m.163.com/nc/article/' +optionId+ '/full.html',
      header: {
        "Content-Type": "application/json"
      },
      method: "GET",
      data: {  

      },
      success: function( res ) {  

        var data = res.data[optionId];
        var imgInfoArr = res.data[optionId].img;  

        //替换标签中特殊字符
        var infoFlg = "<!--SPINFO#0-->";
        var imgFlg = "<!--IMG#";
        var title = " <p style=\"margin:15px 15px; line-height: 20px;\"> " + res.data[optionId].title + "</p>";
        var source = " <p style=\"margin:15px 15px; font-size: 14px; color:darkgray \">来源于: " + res.data[optionId].source + "</p>";
        var content = "<div style=\"margin:10px; line-height:25px; font-weight:200; font-size:17px; color:black; word-break:normal\">" + res.data[optionId].body + "</div>";  

         //替换标签中特殊字符
        var infoFlg = "<!--SPINFO#0-->";
        if (content.indexOf(infoFlg) > ) {
         content = content.replace(/<!--SPINFO#-->/, "");
        }  

        var imgFlg = "<!--IMG#";
        //图片数量
        var imgCount = (content.split(imgFlg)).length-;
        if (imgCount > ) {
          console.log("有dd" + imgCount + "张图片");    

          for (var i = ; i < imgCount; i++) {
            var imgStr = "<!--IMG#" + i + "-->";
            var imgSrc = "\"" + imgInfoArr[i].src + "\"";
            var imgHTML = "<div> <img style=\"width:100%\" src=" +imgSrc+ "> </div>";
            content = content.replace(imgStr, imgHTML);
          }
        }  

        var article = title + source + content ;
        WxParse.wxParse('article', 'html', article, self,imgCount);  

        setTimeout (function () {
          self.setData({
          hide: true
        })
        }, )
      }
    });
}  

})</span> 

css

使用CSS选择器定义标签
使用CSS，您可以使用数百种CSS属性来更改元素在页面上的显示方式。
当你输入<h2 style="color: red">CatPhotoApp</h2>时，你就给h2元素添加了inline style(内联样式)。

这是添加元素的样式的一种方法，但更好的方法是使用CSS，它代表(Cascading Style Sheets)层叠样式表。
在代码的顶端，创建一个如下所示的style元素，：

<style>
</style>
在这个style元素的内部, 你可以为所有h2元素创建一个CSS选择器。例如，如果你希望所有的h2元素都设置为红色, 则你的样式元素将如下所示：

<style>
  选择器 {属性名称: 属性值;}
  h2 {color: red;}
</style>
请注意，围绕每个元素的样式，打开和关闭花括号 ({ 和}) 很重要。您还需要确保元素的样式位于开始和结束样式标签之间。最后，请确保将分号添加到每个元素样式的末尾。
删除你的h2元素的样式属性，而不是创建一个CSSstyle元素。添加必要的CSS，以将所有h2元素变为蓝色。