动态更改样式表，点击网站

Question

我想知道，每当用户点击任何地方时，是否有办法不断更改整个页面的样式表（因此一系列五个左右）。

也许使用$(document).click函数？

Answer 1

为您的主<link>代码指定一个ID并创建您想要的href网址数组。

<link data-style_index="0" id="main-style" href="main.css" rel=.... >

jQuery的：

var styles =['url1.css','url2.css','url3.css'...];

$(document).click(function(){
   var $link =$('#main-style'),
       // get index stored on element data and increment
       nextIndex = $link.data('style_index') + 1;
   //revert to first if at last one already
   if( nextIndex === styles.length){
      nextIndex = 0;
    }
    // change the href and store new index value in tag data
    $link.attr('href', styles[nextIndex]).data('style_index', nextIndex);  

});

使用元素本身在html5 data-属性中存储样式数组的当前索引

Answer 2

选择body内的所有标签，然后单击将color color属性更改为#ccc：

$('*','body').click(function() { $(this).css('color', '#cccccc'); });