Parser XML string

DOMParser Parser XML string

by allen Yu

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>
<div id='app'>
  <b>Title</b> <span id="layerTitle" v-text='title'></span><br>
  <b>ResourceURL</b> <span id="templateUrl" v-text='templateUrl'></span>
</div>

JavaScript

var vm = new window.Vue({
  el: '#app',
  data: {
    xmlDoc: null,
    title: '',
    templateUrl: '',
  },
  created: function() {
    var me = this;
    me.readXml();
  },
  methods: {
    readXml: function() {
      var me = this;
      var txt = `<?xml version="1.0" encoding="UTF-8" standalone="no"?> <Capabilities xmlns="http://www.opengis.net/wmts/1.0" xmlns:ows="http://www.opengis.net/ows/1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:gml="http://www.opengis.net/gml" xsi:schemaLocation="http://www.opengis.net/wmts/1.0 http://schemas.opengis.net/wmts/1.0/wmtsGetCapabilities_response.xsd" version="1.0.0"> <ows:ServiceIdentification> <ows:Title>Taiwan MAP Service</ows:Title> <ows:ServiceType>OGC WMTS</ows:ServiceType> <ows:ServiceTypeVersion>1.0.0</ows:ServiceTypeVersion> </ows:ServiceIdentification> <ows:OperationsMetadata> <ows:Operation name="GetCapabilities"> <ows:DCP> <ows:HTTP> <ows:Get xlink:href="https://wmts.nlsc.gov.tw/wmts/WMTSCapabilities.xml"> <ows:Constraint name="GetEncoding"> <ows:AllowedValues> <ows:Value>RESTful</ows:Value> </ows:AllowedValues> </ows:Constraint> </ows:Get> <ows:Get xlink:href="https://wmts.nlsc.gov.tw/wmts?"> <ows:Constraint name="GetEncoding"> <ows:AllowedValues> <ows:Value>KVP</ows:Value> </ows:AllowedValues> </ows:Constraint> </ows:Get> </ows:HTTP> </ows:DCP> </ows:Operation> <ows:Operation name="GetTile"> <ows:DCP> <ows:HTTP> <ows:Get xlink:href="https://wmts.nlsc.gov.tw/wmts/"> <ows:Constraint name="GetEncoding"> <ows:AllowedValues> <ows:Value>RESTful</ows:Value> </ows:AllowedValues> </ows:Constraint> </ows:Get> <ows:Get xlink:href="https://wmts.nlsc.gov.tw/wmts?"> <ows:Constraint name="GetEncoding"> <ows:AllowedValues> <ows:Value>KVP</ows:Value> </ows:AllowedValues> </ows:Constraint> </ows:Get> </ows:HTTP> </ows:DCP> </ows:Operation> </ows:OperationsMetadata> <Contents> <Layer> <ows:Title>1/100000 地形圖</ows:Title> <ows:Identifier>B100000</ows:Identifier>...