成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

微信小程序?qū)嵺`_4顯示新聞（2）

selfimpr / 1868人閱讀

摘要：前言上一小節(jié)說(shuō)道，點(diǎn)擊版面圖片區(qū)域，可獲取到映射的文章鏈接。本節(jié)將著重實(shí)現(xiàn)對(duì)文章的解析，正則匹配走起通過(guò)對(duì)文章結(jié)構(gòu)的比對(duì)，調(diào)查發(fā)現(xiàn)，文章詳情從的地方開，所以解析文章的函數(shù)如下。

前言

上一小節(jié)說(shuō)道，點(diǎn)擊版面圖片區(qū)域，可獲取到映射的文章鏈接。本節(jié)將著重實(shí)現(xiàn)對(duì)文章html的解析，正則匹配走起~
通過(guò)對(duì)文章html結(jié)構(gòu)的比對(duì)，調(diào)查發(fā)現(xiàn)，文章詳情從class="text_c"的地方開，所以解析文章的函數(shù)如下。

代碼實(shí)現(xiàn)

在utils目錄下新建articleExtract.js

var articleObj = {};
var articleExtract = function (html, newsHref, pagenum) {
  articleObj["newshref"] = newsHref; //該文章的鏈接
  articleObj["pagenum"] = pagenum; //該文章所在版面編號(hào)
  var html = html.replace(/
/ig, "
");
  // console.log(articleHtml);
  /*正則*/
  //文章部分
  var titleReg = /]+class="text_c"[^>]*>[sS]+?
/i; //會(huì)匹配到class=lai的結(jié)束
為止，所以只能用標(biāo)題部分的 //來(lái)源部分 var sourceReg = /]+class="lai"[^>]*>([sS]+?)
/i; //正文圖片 var imgReg = /]+class="pci_c"[^>]*>[sS]+?/ig; //正文文章 var contentReg = /

[sS]*?

/i; //中間變量 // var articleHtml = articleMatch[0];//存放匹配的文章部分的html var titleHtml = ""; var imgHtmlArray = ""; //存放匹配的正文圖片部分的html var contentHtml = ""; //存放匹配的正文文章部分的html //正則匹配結(jié)果 var titleMatch = html.match(titleReg); //存放匹配的文章的結(jié)果 var sourceMatch = html.match(sourceReg); //存放的標(biāo)題部分的html var imgMatch = html.match(imgReg); //存放匹配的正文圖片部分的html var contentMatch = html.match(contentReg); //存放匹配的正文文章部分的html //結(jié)果變量 var h1 = ""; //主標(biāo)題 var h2 = ""; //副標(biāo)題 var h3 = ""; //引標(biāo)題 var h4 = ""; //不知道代表啥標(biāo)題 var source = ""; //來(lái)源及日期 var imgArray = []; //圖片及圖片說(shuō)明 var contentArray = []; //文章每段的內(nèi)容 //給中間變量賦值 titleMatch && (titleHtml = titleMatch[0]); sourceMatch && (source = sourceMatch[1].replace(/s+/g, "")); imgMatch && (imgHtmlArray = imgMatch); contentMatch && (contentHtml = contentMatch[0]); /***********圖片***********************/ if (imgHtmlArray) { var i; var imgSrc = "" var imgDesc = "" for (i = 0; i < imgHtmlArray.length; i++) { imgSrc = imgMatch[i].match(//i)[1].replace("../../../", "http://paper.people.com.cn/rmrb/"); imgDesc = imgMatch[i].match(/

([sS]*?)

/i)[1] imgArray.push({ imgSrc: imgSrc, imgDesc: imgDesc }) } console.log("圖片匹配", imgArray); } /*************標(biāo)題*********************/ h1 = titleHtml.match(/

([sS]+?)

/i)[1]; //標(biāo)題肯定存在，所以用 + h2 = titleHtml.match(/

([sS]*?)

/i)[1] //副標(biāo)題不一定存在，所以用 * h3 = titleHtml.match(/

([sS]*?)

/i)[1] //引標(biāo)題不一定存在，所以用 * h4 = titleHtml.match(/

([sS]*?)

/i)[1] //h4不知道是啥標(biāo)題，所以用 * console.log("標(biāo)題 ", h1); console.log("副標(biāo)題 ", h2); console.log("引標(biāo)題 ", h3); console.log("不知道是啥的h4 ", h4); console.log("來(lái)源", source); console.log("圖片列表", imgHtmlArray); console.log("文章段落列表", contentHtml); /*************正文*********************/ if (contentHtml) { var contents = contentHtml.match(/

.*?

/ig); var p = {}; var text = ""; var strong = "strong"; //某些新聞沒(méi)有正文內(nèi)容（比如廣告，只有一張圖片），因此需要判斷一下 if (contents) { for (i = 0; i < contents.length; i++) { var currentP = contents[i]; text = currentP.match(/

(.*?)

/i)[1].replace(/( )+/g, " "); if ((text.indexOf("STRONG") != -1) || (text.indexOf("FONT") != -1)) { text = text.match(/(.*?)/i)[1].replace(/( )+/g, " "); contentArray.push({ "text": text, "strong": strong }); } else { contentArray.push({ "text": text }); } } } } articleObj["titleObj"] = { title: h1, sub: h2, quote: h3, unknown: h4, source: source } articleObj["imgArray"] = imgArray articleObj["contentArray"] = contentArray return articleObj } module.exports = articleExtract;

修改pages/article/article.js
添加articleExtract函數(shù)

var app = getApp();
//article url
var todayDateArray = require("../../utils/util.js").todayDateArray;
var articleExtract = require("../../utils/articleExtract.js")
var baseUri = "http://paper.people.com.cn/rmrb/html"
//拼接url的變量
//...
Page({
  /**
   * 頁(yè)面的初始數(shù)據(jù)
   */
  data: {
    articleObj:{}
  },

  //...
  onShow: function () {
   // ...
  },
  //請(qǐng)求文章
  getArticle: function (url, newsHref, pagenum) {
    var self = this;
    var reqObj = { url: url };
    wx.request({
      url: url,
      success:function(res){
        var html = res.data;
        //解析文章html，獲取文章標(biāo)題、內(nèi)容等相關(guān)信息
        var tmpArticleObj = articleExtract(html, newsHref, pagenum);
        console.log("文章解析結(jié)果", tmpArticleObj )
        self.setData({
          articleObj: tmpArticleObj,
        });
      }
    });
  },
})

文章解析出來(lái)了，下一步就是把他顯示出來(lái)

顯示文章
在article.wxml，把內(nèi)容簡(jiǎn)單的顯示出來(lái)



  
    
      {{articleObj.titleObj.introTitle}}
      {{articleObj.titleObj.title}}
      {{articleObj.titleObj.subTitle}}
      {{articleObj.titleObj.authors}}
    
    
      
        
        {{item.imgAlt}}
      
    
    
      
        {{item.text}}

至此，文章詳情算是顯示出來(lái)了，下一步，繼續(xù)完善

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/95600.html

相關(guān)文章

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<