简体   繁体   English

删除 <link> 使用jQuery的元素?

[英]Removing <link> element with jQuery?

I don't want to use styles from style.css, so I decided to remove style.css from DOM. 我不想使用style.css中的样式,所以我决定从DOM中删除style.css。 This work just fine in Firefox and IE8, but not in IE6: 这在Firefox和IE8中工作得很好,但在IE6中却没有:

$("LINK[href='http://www.example.com/style.css']").remove();

Any other solution, with jQuery? 使用jQuery的任何其他解决方案?


Here is example: 这是一个例子:
HTML: HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Testing</title>
<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $("link[href*='style.css']").remove();         
});
</script>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="content">...</div>
</body>
</html>

And here is CSS (style.css): 这是CSS(style.css):

#content {
    background-color:#333;
}

Only in IE #content is still dark. 仅在IE #content中仍然是黑暗的。 :( :(
Maybe is jQuery bug? 也许是jQuery的bug?

This is not a bug in jQuery, it is a bug (or possibly, a feature) of the IE rendering engine. 这不是jQuery中的错误,它是IE渲染引擎的错误(或可能是一个功能)。

It seems this problem is being caused by the fact that Internet Explorer does not correctly re-render the page after removing the LINK element from the DOM. 看来这个问题是由于从DOM中删除LINK元素后Internet Explorer没有正确地重新呈现页面这一事实。

In this particular case, the LINK tag is no longer present at the DOM, but IE still displays the CSS that has been loaded into memory. 在这种特殊情况下,DOM不再存在LINK标记,但IE仍然显示已加载到内存中的CSS。

A workaround / solution for this is to disable the stylesheet using the .disabled property like this: 解决方法/解决方案是使用.disabled属性禁用样式表,如下所示:

// following code will disable the first stylesheet
// the actual DOM-reference to the element will not be removed; 
// this is particularly useful since this allows you to enable it
// again at a later stage if you'd want to.
document.styleSheets[0].disabled = true;

EDIT in reply to your comment: 编辑回复您的评论:

Or, if you want to remove it by the href use the following code: 或者,如果要通过href删除它,请使用以下代码:

var styleSheets = document.styleSheets;
var href = 'http://yoursite.com/foo/bar/baz.css';
for (var i = 0; i < styleSheets.length; i++) {
    if (styleSheets[i].href == href) {
        styleSheets[i].disabled = true;
        break;
    }
}

Perhaps it's something strange IE6 does to URL in the href attribute? 也许IE6对href属性中的URL做了什么奇怪的事情? Try something like: 尝试类似的东西:

$("LINK[href*='style.css']").remove();

(ie check whether the href value contains "style.css") (即检查href值是否包含 “style.css”)

It's just a guess, however. 然而,这只是猜测。 If that doesn't work, I recommend checking the JQuery documentation closely on the subject of attribute selectors and the remove method. 如果这不起作用,我建议关于属性选择器和remove方法的主题密切检查JQuery文档。

Also keep in mind that it's also not impossible that it's in fact a bug. 还要记住,它实际上也是一个错误并非不可能。 (IE6 in general causes lots of issues involving JavaScript and DOM manipulation, among other things.) (IE6通常会导致许多涉及JavaScript和DOM操作的问题,等等。)

主题很旧,但您只能在链接元素中添加ID,并按元素删除它:

$("#id").remove();

也许在标签名称上使用小写?

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM