replaceによる置換がうまくいかない

質問

Javascriptを使用して、一回で全てのタグの中身を、それぞれで置き換えるような処理を考えています。
例えばですが、

<data>
<item list="りんご,みかん,なし">果物</item>
<item list="あじ,さんま,まぐろ">魚類</item>
<item list="とり,ぶた,うし">肉類</item>
</data>

を下のように置換することは可能でしょうか？

<data>
<item list1="りんご" list2="みかん" list3="なし">果物</item>
<item list1="あじ" list2="さんま" list3="まぐろ">魚類</item>
<item list1="とり" list2="ぶた" list3="うし">肉類</item>
</data>

if, match, replaceを使って、strに元の文字列が入っているとして、

if (str.match(/<item list=\"([^<]+)\">[^<]+<\/item>/)) {
food = RegExp.$1.split(",");
str = str.replace(/<item list=\"[^<]+\">[^<]+<\/item>/, "<item list1=" + food[0] + …);
}

としてみたのですが、当然ながら全てのitemタグの中身がりんご、みかん、なしに置換されてしまいます。
一列ずつ置換する方法はありますか？一列といっても元の文字列は改行がない場合を考えています。

よろしくご教示ください。お願いいたします。

回答No.3

Chaire · ベストアンサー

getElementById を使いたいなら、

<!DOCTYPE data [
　<!ELEMENT data ANY>
　<!ATTLIST data id ID #IMPLIED>
]>

で id 属性を ID 型として宣言しなければなりません。

※ DOM Level 1 の getElementById は HTML モジュールのメソッドなので、HTML では id という名前の属性が ID 型であると知っています。しかし、DOM Level 2 からは HTML に限らない Core モジュールに移動になりましたので、何が ID 型の属性であるかを教えてやらねばなりません。MSXML の nodeFromID も同様です。

※ text/html、application/xhtml+xml ならば実装が (X)HTML のスキーマを知っているはずですから、無条件で getElementById を使えるように見えます（実際、HTML5 はそう規定しています）。しかし、application/xml（特に混合文書）の場合の保証はありません。それゆえ、スキーマなしで ID を扱える xml:id 規定が作られましたが、それはそれで問題が生じています。

----

とにかく、スキーマ不在の XML 処理に Core メソッドでちまちまやるのも何ですので、Firefox 前提なら（多少使いにくいですが）XPath の方がまだ確実です。名前空間には十分に注意を払って下さい。

<xh:script type="application/javascript; version=1.6" xmlns:xh="http://www.w3.org/1999/xhtml">

var r = document.evaluate('/child::data/child::item[@list]', document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
var I = r.snapshotLength;
var i;
var n;
var f = function(v, i) { this.setAttribute('list' + (i + 1), v); };

for (i = 0; I > i; i++) {
　n = r.snapshotItem(i);
　n.getAttribute('list').split(/\s*,\s*/).forEach(f, n);
　n.removeAttribute('list');
}
</xh:script>

なお、属性に順序はありませんので、list1、list2、……と連番にしても、人間が読みやすい以上の意味はありませんし、期待通りに処理できるとも限りません。データにリスト以上の構造を持たせるならば、属性ではなく要素にすべきです。

回答No.2

yambejp

これはどのレベルのXMLを宣言しているのでしょうか？
firefox3であればモダンブラウザのたいていの機能は包含しているはずですが・・・
もしくはなにか特殊なOSや環境？

回答No.1

yambejp

こんな感じじゃないですか？

<script>
window.onload=function(){
var n=document.getElementById("hoge").getElementsByTagName("item");
for(var i=0;i<n.length;i++){
var l=n[i].getAttribute("list").split(",");
for(var j=0;j<l.length;j++){
n[i].setAttribute("list"+(j+1).toString(),l[j]);
}
n[i].removeAttribute("list");
}
}
</script>

<data id="hoge">
<item list="りんご,みかん,なし">果物</item>
<item list="あじ,さんま,まぐろ">魚類</item>
<item list="とり,ぶた,うし">肉類</item>
</data>

補足

ご回答をいただき有難うございます。
上記の方法も試してみましたが、getElementByIdとgetElementsByTagNameの部分で「getElementById is not a function」のエラーが出てしまいます。
ブラウザはFirefox3.0.9です。