如何從JavaScript中的XML行獲取屬性？

Question

我將此行作為uml doc的一部分。

<children xmi:type="corstr:heighj" uml:name="private" x="255" y="188" width="221" height="51"/>

• 我需要x，y寬度和高度的值*

我嘗試了此功能

function getValues(mainBlock, valueLine)   {


console.log("searching for data in " + valueLine)

console.log("x? " + getValueFromLine(valueLine, "x=\""));
console.log("y? " + getValueFromLine(valueLine, "y=\""));
console.log("width? " + getValueFromLine(valueLine, "width=\""));



function getValueFromLine(valueLine, searchFor)
{
    var position = valueLine.indexOf(searchFor);

    return valueLine.substr(position + searchFor.length, (valueLine.indexOf("\"", position + searchFor.length)) - position + searchFor.length);
}

但顯然出了點問題，所以我在控制台中得到了

x? 255" y="1<br>
index1.html:179 y? 188" width<br>
index1.html:180 width? 221" height="51"/

Answer 1

我不確定是否有解決方案，但是我編寫了一個可以幫助您的函數。

我采用了分解字符串並分別解析屬性的方法，並允許您根據需要使用元素-我編寫了一個函數作為給定字符串的閉包。

它在SPACE上拆分，然后我分析細目分類並在EQUALS上拆分，然后盡可能解析整數，以最終創建一個包含解析值的對象。 該函數中包含一個幫助程序函數，可為您提供指定的值。

看一下小提琴 ，如果您不懂代碼，請告訴我。

function parse_uml(valueLine) {
    var value_map = {};
    var breakdown = valueLine.split(" ");
    breakdown.shift();
    breakdown[breakdown.length - 1] = breakdown[breakdown.length - 1].substr(0, breakdown[breakdown.length - 1].length - 2);
    breakdown.map(function (i) {
        var attr = i.split("=");
        if (parseInt(attr[1].substr(1, attr[1].length - 2))) {
            value_map[attr[0]] = parseInt(attr[1].substr(1, attr[1].length - 2));
        } else {
            value_map[attr[0]] = attr[1].substr(1, attr[1].length - 2);
        }
    });
    return function (searchFor) {
        return value_map[searchFor];
    };
}

用法-

var parsed_uml = parse_uml('<children xmi:type="corstr:heighj" uml:name="private" x="255" y="188" width="221" height="51"/>', 'width');

console.log("Value of x - " + parsed_uml("x"));
console.log("Value of y - " + parsed_uml("y"));
console.log("Value of width - " + parsed_uml("width"));

http://jsfiddle.net/u6yxb4es/

Answer 2

嗨，我寫了一個XML解析器，為您分叉。 此代碼將dom元素轉換為對象。 可能是以下代碼可幫助您提取給定XML標記中的屬性。

http://jsfiddle.net/wyqm16k0/

 function parsethis(line){
  var x = line.split(" "), dom = x.shift(), obj;
  dom = dom.replace("<","");
  x[x.length-1] = x[x.length-1].replace("/>","");
  x.forEach(function(element, index, array){
    var str = '"'+array[index];
    str = str.replace('=','":');
    array[index] = str;
  });

  obj = x.join("");
  obj = "{"+obj.replace(/""/g,'","')+"}";
  obj = JSON.parse(obj);
  obj.dom = dom;
  return obj;
}

var parsed = parsethis('<children xmi:type="corstr:heighj" uml:name="private" x="255" y="188" width="221" height="51"/>');
console.log("X = "+parsed.x,", Y = "+parsed.y, ", Width = "+parsed.width);

Answer 3

您可以使用DOMParser API將整個文檔解析為xml文件，然后使用其getAttributeNS()方法像其他任何DOMElement一樣獲取元素。

由於我沒有整個文檔，因此在將未聲明的xsi和uml命名空間的屬性從字符串中刪除后，這里提供了概念證明：

 function cleanNS(input) { var str = input.split(' '); var cleaned = []; str.forEach(function(e) { if (e.split('=')[0].indexOf(':') === -1) { cleaned.push(e); } }); return cleaned.join(' '); } var parser = new DOMParser(); var cleanDoc = cleanNS('<children xmi:type="corstr:heighj" uml:name="private" x="255" y="188" width="221" height="51"/>'); var element = parser.parseFromString(cleanDoc, 'application/xml').documentElement; function log(str) { document.body.innerHTML = str; } log("x = " + element.getAttributeNS(null, 'x') + ", y = " + element.getAttributeNS(null, 'y') + ", width = " + element.getAttributeNS(null, 'width'));