如何使用regexp(javascript)获取style =“我想要css代码”

时间:2010-08-30 01:14:26

标签: javascript regex

var text = '..<anything><anything style="color:red;">hello</anything><anything style="color:blue; font-size:1em;">hello</anything></anything>...';

var text = "..<anything><anything style='color:red;'>hello</anything><anything style='color:blue; font-size:1em;'>hello</anything></anything>...";

结果:

array[0] = "color:red;";
array[1] = "color:blue; font-size:1em;";

3 个答案:

答案 0 :(得分:3)

创建一个临时元素并使用innerHTML,然后使用getElementsByTagNamegetAttribute('style'),如果它是这样的字符串。

如果它是对DOM元素的引用,则跳过innerHTML部分。

var d = document.createElement('div'), 
    text = '..<anything><anything style="color:red;">hello</anything><anything style="color:blue; font-size:1em;">hello</anything></anything>...', 
    styles = [];
    d.innerHTML=text;
    var els = d.getElementsByTagName('*');
    for ( var i = els.length; i--; ) {  
        if ( els[i].getAttribute('style') ) { 
           styles.push(  els[i].getAttribute('style')  )
        }
    }
    styles

jQuery将是..

$(text).find('*').map(function() { return this.getAttribute('style') })

答案 1 :(得分:2)

正如已经提到的,使用正则表达式解析HTML并不是一个好主意。

但是,如果您决定这样做,这将为您完成工作:

var matches = text.match(/\bstyle=(['"])(.*?)\1/gi);
var styles = [];
for(var i = 0; i < matches.length; i++) {
    styles.push(matches[i].substring(7, matches[i].length - 1));
}

答案 2 :(得分:0)

meder已经给出了正确答案,但由于需要正则表达式解决方案,我会给出一个。有关使用正则表达式解析非正规语言(如HTML(或SGML或XML))的所有常见警告均适用。

/<[a-z]+(?:\s+ [a-z]+\s*=\s*(?:[^\s"']*|"[^"]*"|'[^']*'))\s+style\s*=\s*"([^"]*)">/g