微信小程序解析Xml

于 2018-06-29 14:15:16 发布
阅读量3.5k 收藏 3
点赞数
分类专栏： 微信小程序 文章标签： 微信小程序 XML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_16646819/article/details/80856043
版权

因为项目需要，需要在小程序中解析Xml标签，去除需要的内容；


// pages/text/text.js
var WxParse = require('../../wxParse/wxParse.js');
import api from '../../utils/util.js';
Page({

    /**
     * 页面的初始数据
     */
    data: {
        text: '',
        Goods: '',
        type: '',
        title: '',
        recommend: '',
        share:'',
        imgLink:'',
        shareTitle:''
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function(options) {
        var that = this;
        wx.getStorage({
            key: 'text',
            success: function(res) {
                var summary = res.data; //文章主题内容
                that.setData({
                    title: '推荐预览'
                })
                tuijian(summary, " ", that);

            },
        })
    },
    call: function(e) {
        wx.makePhoneCall({
            phoneNumber: e.currentTarget.dataset.phone,
        })
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function() {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function() {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function() {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function() {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function() {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function() {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function() {

    }
})

function tuijian(str, is_global, that) {
    var result;
    result = str.replace(/(^\s+)|(\s+$)/g, "");
    if (is_global.toLowerCase() == "g") {
        result = result.replace(/\s/g, "");
    }
    Recommend(result, that)
}

function Recommend(str, that) {
    var list = [];
    var doc = api.parseFromString(str);
    var str = api.serializeToString(doc, false, null);
    var glist = doc.getElementsByTagName('glist');
    var share = doc.getElementsByTagName('share');
    var imgLink = doc.getElementsByTagName('imgLink');
    var ary = new Array();
    for (var i = 0; i < doc.childNodes.length; i++) {
        var html = []
        if (doc.childNodes[i].nodeName == 'glist') { //判断标签是否为glist
            var Glist = doc.childNodes[i].childNodes;
            // console.log('Glist:',Glist)
            var Two = [];
            var beginX = new Date().getTime();
            for (var j = 0; j < Glist.length; j++) {
                if (Glist[j].nodeType == 1) {
                    // debugger
                    var Three = [];
                    var seconed = Glist[j];
                    // console.log(j, Glist[j].childNodes);
                    for (var m = 0; m < Glist[j].childNodes.length; m++) {
                        var text;
                        var phone;
                        var port;
                        var date;
                        var price;
                        var remark;
                        //判断是否有text标签
                        if (Glist[j].childNodes[m].nodeName == 'text') {
                            //判断子节点内是否为空
                            if (Glist[j].childNodes[m].childNodes != null && Glist[j].childNodes[m].childNodes.length > 0) {
                                text = Glist[j].childNodes[m].childNodes[0].nodeValue.trim();
                            } else {
                                text = '';
                            }
                            Three.push(text);
                        }
                        //判断是否有gphone标签
                        if (Glist[j].childNodes[m].nodeName == 'gphone') {
                            //判断子节点内是否为空
                            if (Glist[j].childNodes[m].childNodes != null && Glist[j].childNodes[m].childNodes.length > 0) {
                                phone = Glist[j].childNodes[m].childNodes[0].nodeValue.trim();
                            } else {
                                phone = '';
                            }
                            Three.push(phone);
                        }
                        if (Glist[j].childNodes[m].nodeName == 'port') {
                            //判断子节点内是否为空
                            if (Glist[j].childNodes[m].childNodes != null && Glist[j].childNodes[m].childNodes.length > 0) {
                                port = Glist[j].childNodes[m].childNodes[0].nodeValue.trim();
                            } else {
                                port = '';
                            }
                            Three.push(port);
                        }
                        if (Glist[j].childNodes[m].nodeName == 'date') {
                            //判断子节点内是否为空
                            if (Glist[j].childNodes[m].childNodes != null && Glist[j].childNodes[m].childNodes.length > 0) {
                                date = Glist[j].childNodes[m].childNodes[0].nodeValue.trim();
                            } else {
                                date = '';
                            }
                            Three.push(date);
                        }
                        if (Glist[j].childNodes[m].nodeName == 'price') {
                            //判断子节点内是否为空
                            if (Glist[j].childNodes[m].childNodes != null && Glist[j].childNodes[m].childNodes.length > 0) {
                                price = Glist[j].childNodes[m].childNodes[0].nodeValue.trim();
                            } else {
                                price = '';
                            }
                            Three.push(price);
                        }
                        if (Glist[j].childNodes[m].nodeName == 'remark') {
                            //判断子节点内是否为空
                            if (Glist[j].childNodes[m].childNodes != null && Glist[j].childNodes[m].childNodes.length > 0) {
                                remark = Glist[j].childNodes[m].childNodes[0].nodeValue.trim();
                            } else {
                                remark = '';
                            }
                            Three.push(remark);
                        }
                    }
                    Two.push(Three);
                }
            }
            list.push(Two);
        } else if (doc.childNodes[i].nodeName == 'share') {
            that.setData({
                shareTitle: doc.childNodes[i].childNodes["0"].nodeValue
            })
        } else {
            var beginY = new Date().getTime();
            var text = api.serializeToString(doc.childNodes[i], false, null);
            var artcile = WxParse.wxParse('text', 'html', text, that, 0, 0);
            html.push("html")
            html.push(artcile);
            list.push(html);
        }
    }
    that.setData({
        recommend: list
    }, function () {
        console.log('recommend:', that.data.recommend)
    })
}

<view class='tuijian_box'>
    <view class='tuijian'>
        <block wx:for='{{recommend}}' wx:key='list'>
            <block wx:if="{{item[0]== 'html'}}">
                <view wx:for='{{item[1]}}' wx:key='html1' style='{{item.styleStr}}'>
                    <template is="wxParse" data="{{wxParseData:item.nodes}}" />
                </view>
            </block>
            <view class='good_list' wx:else>
                <view class='item' wx:for="{{item}}" wx:key="bbb">
                    <view class='phone'>
                        <view class='text'>货物信息：{{item[0]}}</view>
                        <view class='number' bindtap='call' data-phone="{{item[1]}}" wx:if='{{item[1]}}'>
                            <view class='number_text'>
                                <image src='../../img/phone.png'></image>{{item[1]}}
                            </view>
                            <image src='../../img/phone_bg.jpg' class='phone_bg'></image>
                        </view>
                    </view>
                    <view class='text'>
                        <text>装卸港口：</text>{{item[2]}}</view>
                    <view class='text'>
                        <text>装卸日期：</text>{{item[3]}}</view>
                    <view class='text'>
                        <text>包干运价：</text>{{item[4]}}</view>
                    <view class='text'>
                        <text>其他备注：</text>{{item[5]}}</view>
                </view>
            </view>
        </block>
    </view>
</view>
下面是until.js
var app = getApp();
var Parser = require("../libs/dom-parser");
var Dom = require("../libs/dom");
var DOMParser = new Parser.DOMParser();
var XMLSerializer = new Dom.XMLSerializer();

var parseFromString = function (str) {
  return DOMParser.parseFromString(str)
}

var serializeToString = function (doc) {
  return XMLSerializer.serializeToString(doc, false, null)
}

module.exports = {
  parseFromString: parseFromString,
  serializeToString: serializeToString
}

需要解析的内容（glist里面是货单,需要有联系方式及；因为文章详情是返回一个text,需要进行特殊处理，将glist里面的内容转换成一个数组的形式，glist以外的内容则通过 wx.parse进行处理展现）

<share>一手靠谱好货，货真价优！-江苏永盛船务有限公司</share>
    <p>
        <img src="http://res1.chuanlaoda.cn/tt_images/1/8942.jpg" />
    </p>
<div class="title" style="padding-left: 30rpx;font-weight: bold; border-left: 10rpx solid Tomato;font-size: 34rpx;margin:50rpx 0 30rpx;">实时货单</div>
    <glist>
       <a>
            <text>矿石</text>
            <gphone>13914200999</gphone>
            <port>江阴港→湖口</port>
            <date>6月30日</date>
            <price>12元/吨</price>
            <remark>无</remark>
        </a>
    </glist>

    <div class="title" style="padding-left: 30rpx;font-weight: bold; border-left: 10rpx solid Tomato;font-size: 34rpx;margin:30rpx 0;">公司信息</div>
    <p  style="margin-bottom:30rpx;">
        <img src="http://res1.chuanlaoda.cn/tt_images/1/8952.jpg"/>
    </p>
    <div style="padding:20rpx; background-color:SlateGray;border-radius:5px;color:white;box-shadow:5px 5px 5px DarkGrey;margin-bottom:30rpx;">
        <p style="text-indent:2em;line-height:1.5;font-size:34rpx;margin-bottom:5px;">江苏永盛船务有限公司于2011年3月成立（在此之前用江阴港盛运作，实际经营历史可追溯到2007年），是经交通运输部批准的无船承运人，从事国内国际运输代理业务的专业公共船舶代理企业，是江苏最大公共船舶代理公司。在江阴周边（南通、张家港、泰州、扬州等）有多家分公司，业务已覆盖整个江苏港口，为大家提供更好更优质的服务！</p>
        <p style="text-indent:2em;line-height:1.5;font-size:34rpx;margin-bottom:5px;">公司主运：矿石、煤炭、钢材、粮食、PTA、非金矿等干散货及大件、特种运输业务。</p>
        <p style="text-indent:2em;line-height:1.5;font-size:34rpx;margin-bottom:5px;">电话：0510-81606111/80625199 </p>
        <p style="text-indent:2em;line-height:1.5;font-size:34rpx;margin-bottom:5px;">网址：http://www.jsyscw.com</p> 
        <p style="text-indent:2em;line-height:1.5;font-size:34rpx;margin-bottom:5px;">地址：江苏省江阴市滨江中路543-536号嘉年华城市广场21楼</p>
    </div>
<p  style="margin-bottom:30rpx;">
        <img src="http://res1.chuanlaoda.cn/tt_images/1/8951.jpg"/>
    </p>
<p  style="margin-bottom:30rpx;">
        <img src="http://res1.chuanlaoda.cn/tt_images/1/8905.jpg"/>
    </p>
需要的文件：

WxParse.js

dom.js

dom-parser.js

entities.js

sax.js

有需要附件可以查看链接： https://download.youkuaiyun.com/download/qq_16646819/10507908



评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值