微信小程序资料总结
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) > 0) { content = content.replace(/<!--SPINFO#0-->/, ""); }</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) > 0) { content = content.replace(/<!--SPINFO#0-->/, ""); } var imgFlg = "<!--IMG#"; //图片数量 var imgCount = (content.split(imgFlg)).length-1; if (imgCount > 0) { console.log("有dd" + imgCount + "张图片"); for (var i = 0; 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 }) }, 500) } }); } })</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元素变为蓝色。
@青山不移,文笔不息。学习,坚持,梦想青春!