通过Jquery .append()调用一个CSS文件，并通过再次单击相同的元素将其删除
通过Jquery .append()调用一个CSS文件，并通过再次单击相同的元素将其删除
提问于 2012-10-07 19:06:17
我在HTML中有一个链接：
<li class="skip-link-diszlexia"><a class="assistive-text" href="#" title="Diszlexia barát nézet">Diszlexia barát nézet</a></li>我想通过Jquery javascript调用另一个CSS，即更改一些div和段落上的font-family和style，在第二次单击相同的元素后，返回到start。我根本不是Javascript程序员，我阅读了Jquery文档并创建了这个。它将diszlexia.css文件与默认的style.css组合在一起没有问题，但第二次单击(我想从使用中删除diszlexia.css )不起作用：
// Jquery CSS switcher (Diszlexia barát nézet)
$(document).ready(function() {
$(".skip-link-diszlexia").click(function(){
$(this).append('<link rel="stylesheet" type="text/css" media="all" href="css/diszlexia.css" />');
return false;
$(this).append('<link rel="stylesheet" type="text/css" media="all" href="css/diszlexia.css" />').remove();
return false;
});
});我不想使用.addClass()，.removeClass()或.css()，因为我需要更改许多元素的字体系列，并且只需添加另一个带有更改的CSS (就像我们为be添加自定义样式表一样)将会容易得多。
有没有人能帮我改正我的烂代码？
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-10-07 19:15:45
我想你需要在每次点击时切换引用。意思是如果它被应用，移除它，如果被移除，那么应用它，因此你应该尝试这样做：
$(document).ready(function() {
$(".skip-link-diszlexia").click(function(){
if($(this).find("link").length <= 0)
$(this).append('<link rel="stylesheet" type="text/css" media="all" href="css/diszlexia.css" />');
else
$(this).find("link").remove();
});
});Stack Overflow用户
发布于 2012-10-07 19:23:06
最简单的解决方案可能是在body标记上使用addClass和removeClass，并使用css规则来更改基于body类的字体。删除链接标记可能不会撤消字体更改
简化的css示例
div { font-family: arial}
.dislexia div { font-family: verdana}JS
$(".skip-link-diszlexia").click(function(){
$('body').addClass('dislexia');
})页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12768255
复制相关文章
相似问题
腾讯云开发者
