Question

在JS中，我将HTML页面作为字符串变量的值。我需要删除该页面中的所有样式。

我可以这样做：

$(data).find("link[rel=stylesheet]").remove()

但如果我理解正确，jQuery只能在体内找到。

我不想使用正则表达式。我确信有一个简单的解决方案。
我想也许有办法使用XPath。

请给我一个方法来做到这一点！

我的代码：

Y.io.request('' + dataUrl, {
    dataType: 'html',
    method: 'get',
    cache: 'true',
    on: {
        success: function () {
            var data = this.get('responseData');
            child.setContent(data);
        }
    }
}

数据是HTML页面。我需要在插入child之前从中删除样式。

Answer 1

我认为您的问题不明确，但如果您想从HTML网页中删除所有样式表，请执行此操作;

$('html').find("link[rel=stylesheet]").remove()

jQuery只能在body中找到它，它可以处理DOM的任何元素，包括整个<html>或<head>。

因此，如果您的var data看起来像这样：

'<html> <head> ... </head> <body> ... </body> </html>'

您编写的选择器将完美运行。

Answer 2

不幸的是，如果你想让它解析一个完整的DOM并直接将它当作HTML来对待，jQuery有点窒息。也就是说，如果你对返回的HTML页面的格式良好有所保证（主要是它是有效的XML吗？），那么我们可以通过将页面内容视为XML文档来做一些hacky变通方法。看看这个示例代码：

var content = '<html><head><link rel="stylesheet" type="text/css" href="mystyle.css"></link></head><body>hello</body></html>';
// $xml now has a jquery wrapped xml doc
var $xml = $($.parseXML(content));
// find the stylesheets and remove them
$xml.find("link[rel=stylesheet]").remove();
// $xml.contents() contains the jquery wrapped doc-content (i.e. the <html> tag and its contents)
console.log($xml.contents()[0].outerHTML);

最终的console.log应输出页面的HTML内容（减去我们在第5行中删除的链接节点）。

再次注意， HTML内容必须是有效的XML才能使其正常工作。这意味着包括结束标签： - ）

编辑：这里是一个小提琴http://jsfiddle.net/rgsaz33e/1/

修改包含HTML的JS字符串的方法

2 个答案: