Случайный CSS через JS
Python на самом деле ведет себя, как определено. Три отдельных функции создаются, но каждый из них имеет закрытие среды, они определяются в - в этом случае, глобальная среда (или среда внешней функции, если цикл помещается в другой функции). Это - точно проблема, хотя - в этой среде, я видоизменен , и закрытия весь отсылают к тому же меня .
Вот лучшее решение, которое я могу предложить - создают функционального создателя и вызывают это вместо этого. Это вызовет различные среды для каждой из созданных функций, с отличающийся я в каждом.
flist = []
for i in xrange(3):
def funcC(j):
def func(x): return x * j
return func
flist.append(funcC(i))
for f in flist:
print f(2)
Это - то, что происходит, когда Вы смешиваете побочные эффекты и функциональное программирование.
9 ответов
Попробуйте программно создать элемент ссылка и добавить его в заголовок:
function applyRandCSS(){
var css = ["css/1.css", "css/2.css", "css/3.css", "css/4.css"];
var randomFile = css[Math.round(Math.random()*(css.length-1))];
var ss = document.createElement("link");
ss.type = "text/css";
ss.rel = "stylesheet";
ss.href = randomFile;
document.getElementsByTagName("head")[0].appendChild(ss);
}
Страница уже отображается, когда вы "добавляете" таблицу стилей. Этот тип подстановки лучше всего делать на сервере.
Я не эксперт по JavaScript, но, возможно, он не находит css внутри функции. Значит, вы должны объявить его перед функцией?
var css = new Array(
'<link rel="stylesheet" type="text/css" href="css/1.css">',
'<link rel="stylesheet" type="text/css" href="css/2.css">',
'<link rel="stylesheet" type="text/css" href="css/3.css">',
'<link rel="stylesheet" type="text/css" href="css/4.css">'
);
function getRand(){
var css
return Math.round(Math.random()*(css.length-1));
}
rand = getRand();
document.write(css[rand]);
Нет, это работает.
в cssTest.html:
HI!
<script>
function getRand(){
return Math.round(Math.random()*(css.length-1));
}
var css = new Array(
'<link rel="stylesheet" type="text/css" href="1.css">',
'<link rel="stylesheet" type="text/css" href="2.css">',
'<link rel="stylesheet" type="text/css" href="3.css">',
'<link rel="stylesheet" type="text/css" href="4.css">'
);
rand = getRand();
document.write( "Choosing " + rand ) ;
document.write(css[rand]);
</script>
HELLO!
в 1.css
*
{
color: Red;
}
в 2.css
*
{
border: solid 2px green ;
}
в 3.css
*
{
font-size: 40em;
}
в 4.css
*
{
border: solid 5px red ;
}
Здесь есть очень хорошая техника для переключения таблиц стилей с помощью jQuery . Его можно легко комбинировать с вашим рандомизатором.
Если по какой-то причине это не нужно делать на стороне клиента, делайте это на сервере.
Чтобы он работал, элемент ссылки должен находиться внутри элемента head, document.createElement /element.append
Возможно, придирка, но вы, вероятно, захотите:
function getRand() {
return parseInt(Math.random()*css.length);
}
Если ваш CSS не сильно различается, вы можете сделать то же, что и я, и генерировать CSS случайным образом при каждой загрузке страницы
function mutate() {
var font = new Array();
font[0] = 'monospace';
font[1] = 'arial';
font[2] = 'verdana';
font[3] = 'trebuchet-ms';
font[4] = 'lucida grande';
font[5] = 'calibri';
font[6] = 'bitstream charter';
font[7] = 'liberation sans';
font[8] = 'Mona';
font[9]= 'MS Pgothic';
font[11]= 'helvetica';
font[11]= 'Dejavu sans';
var whichbfont = Math.floor(Math.random()*(font.length));
/* Random bgcolor maker */
function bgcolour() {
var bred = Math.floor(128+Math.random()*128);
var bgreen = Math.floor(128+Math.random()*128);
var bblue = Math.floor(128+Math.random()*128);
return 'rgb('+bred+', '+bgreen+', '+bblue+')';
}
var bgcolor = bgcolour();
/* Random bgcolor maker */
function bcolour() {
var red = Math.floor(Math.random()*128);
var green = Math.floor(Math.random()*128);
var blue = Math.floor(Math.random()*128);
return 'rgb('+red+', '+green+', '+blue+')';
}
var bcolor = bcolour;
document.write ('<style type=\"text/css\">'+
'b,a \n'+
'{font-family: '+font[whichbfont]+' !important; color: '+bcolor+' !important;}\n'+
'body {background-color: '+bgcolor+';!important}\n'+
'</style>');
}
За исключением того, что ваш CSS, очевидно, будет адаптирован для вашего собственного сайт.