使用正則表達式替換XML屬性值

我有一個svg存儲在一個字符串中。它的一部分看起來像：使用正則表達式替換XML屬性值

var str = '<svg version="1.1" width="1400px">';

我正在尋找一個解決方案，將取代任何給定的屬性的值。現在，如果我想改變width，我做了以下內容：

var prop = "width"; 
var newValue = "100px"; 
var regex = new RegExp(prop + '="[^"]*'); 
str = str.replace(regex, prop + '="' + newValue);

有沒有辦法用一個正則表達式來做到這一點，這樣我不必然後建造一個字符串？

或換句話說，什麼是正則表達式，它將在特定字符串前面僅選擇引號之間的文本？

fill="**howCanISelectThisText?**"

來源

2013-04-18 Jim Hall

爲什麼不使用XML解析器呢？ – rcdmk

我不想使用xml解析器，因爲我將它編碼爲數據uri，包含在一個css文件中。它毫無意義的沉重。 –

是的，當我測試它時，它在Reggy中工作。你知道什麼，它不在POSIX上。 –

更好地使用緩衝區並把它作爲一個真正的HTML對象;

JSfiddle

HTML

<div id="hidden"></div>

CSS

#hidden { 
    display: none; 
}

的JavaScript

var hidden = document.getElementById('hidden'); 
var str = '<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" fill="#ffffff" width="1400px" height="180px" viewBox="0 0 1400 180" enable-background="new 0 0 1400 180" xml:space="preserve">'; 
hidden.innerHTML = str; 

var prop = "width"; 
var newValue = "100px"; 

var svgObject = hidden.getElementsByTagName('svg')[0]; 
svgObject.setAttribute(prop, newValue) 

console.log(svgObject.getAttribute('width')); 

// Done 
str = hidden.innerHTML; 

// When you're done, empty hidden buffer 
hidden.innerHTML = '';

來源

2013-04-18 15:21:58

+1只是要發佈這個，但有一個內存元素; 'var el = document.createElement（「div」）; el.innerHTML = str +「」;''''和'el.firstChild.getAttribute ...' –

虛擬可能工作也一樣好:)。我喜歡有時參考視覺參考。當然可以始終虛擬化該DOM元素。 – 2013-04-18 15:26:17

這是不是一個正則表達式的工作！這是一個XML解析器的工作。所有「現代」瀏覽器（這意味着IE 9+）應該有一個內置的。它被稱爲DOMParser。

_{文檔：https://developer.mozilla.org/en-US/docs/Parsing_and_serializing_XML}

它的使用非常簡單，比的正則表達式更容易！這裏有一個例子：

var str = '<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" fill="#ffffff" width="1400px" height="180px" viewBox="0 0 1400 180" enable-background="new 0 0 1400 180" xml:space="preserve">'; 

var parser = new DOMParser; 
var serializer = new XMLSerializer; 

// Your string doesn't have a close tag, it won't parse without one 
var doc = parser.parseFromString(str+'</svg>', 'application/xml'); 

doc.documentElement.setAttribute('width', '100px'); 

// The serializer will self-close the element, let's remove that 
str = serializer.serializeToString(doc).replace('/>', '>'); 

console.log(str);

DEMO：http://jsfiddle.net/qpu33/

來源

2013-04-18 15:24:42

使用正則表達式替換XML屬性值

回答

相關問題