DOMのelement.styleを使用して元のスタイル名を取得する

Question

この質問に答えるうちにDOM parser: remove certain attributes only私はいくつかのプロパティがelement.styleプロパティで展開され、変換されていることに気付きました。例えば：1想像のとおり、このdiv要素の

<div style="font-weight: bold"></div> 

styleは、一つの特性、font-weightが含まれています。しかし：-moz-text-blink、-moz-text-decoration-color、-moz-text-decoration-line、-moz-text-decoration-style：

このdiv要素のために

<div style="font-decoration: underline"></div> 

、styleプロパティは、Firefoxで、4つのプロパティが含まれています。

自分でスタイル属性を解析するために元のfont-decorationを取得する唯一の方法はありますか？それとも良い方法がありますか？私はそれを自分で解析すべきか、これを行うための「標準的な」方法がありますか？

Answer 1

まあ、私はそのことについてもう少し研究をして、あなたの要求をより良く解決する方法を見つけました。ちょうど使用してHTMLで定義されているあなたは、スタイルを取得することができます：

if(document.getElementById('foo').attributes['style'])  
    style = document.getElementById('foo').attributes['style'].value; 

これはFF、ChromeとIE（のみIE9でテスト）に適しています。

Answer 2

あなたは要素（see this question for a discussion on outerHTML）のouterHTMLプロパティを使用して、それからスタイル値を解析することができます

チェックこのフィドル：http://jsfiddle.net/DRx88/

全コード：

function outerHTML(node){ 
    return node.outerHTML || new XMLSerializer().serializeToString(node); 
} 
function trimString(s) { 
    var l = 0, r = s.length - 1; 
    while(l < s.length && s[l] == ' ') l++; 
    while(r > l && s[r] == ' ') r -= 1; 
    return s.substring(l, r + 1); 
} 
function getStyleAsInHTML(node) { 
    var parts, part, sIndex = -1, i, style = '', delim; 
    parts = outerHTML(node); 
    parts = parts.replace(/\s/g," "); 
    parts = parts.split('='); 

    for(i=0; i<parts.length; i++) { 
    part = trimString(parts[i]); 
    if(part.length >= 5 && part.substring(part.length-5).toLowerCase()=='style') { 
     sIndex = i+1; 
     break; 
    } 
    } 
    if(sIndex!=-1 && sIndex<parts.length) { 
    style = parts[sIndex]; 
    delim = style.charAt(0); 
    for(i=style.length-1; i>0; i--) { 
     if(style.charAt(i)==delim) { 
     style = style.substring(1, i); 
     break; 
     } 
    } 
    } 
    return style; 
} 
document.getElementById('result').innerHTML = 'Style as in HTML [' + getStyleAsInHTML(document.getElementById('d2')) + ']';