JQuery Создание элемента стиля на лету - PullRequest
0 голосов
/ 11 июля 2010

Я хочу создать элемент стиля после загрузки страницы (скажем, через 2-3 секунды после загрузки страницы)

HTML

<html>
<body>
   <div id="div1" >
      <div id= "div2" > some text goes here </div>
   </div>
</body>
</html>

Javascript

$(function () {

    var style = $('<style type="text/css" />').appendTo('head');
    style.html('body{ background:#000; }
                             \n
                            \#div1{ background:#0099f9; }'
    //I'm having some more elements which I need to alter their style attr's
    );

    var attr = style.html;

    style.html(attr + '\n\#div2{ background:#f0f; }');
});

У меня также есть куча html-элементов (еще несколько элементов, кроме упомянутых), в которых мне нужно изменить их стили после загрузки страницы

Я чувствую трудности, когда пытаюсь прочитать свой код, потому что он жестко запрограммирован,

Я также сталкиваюсь с проблемой, когда мне нужно добавить некоторые элементы к тегу стиля выше

Это простой способ сделать это и сделать его простым для удобочитаемости

Спасибо за помощь !!

Хорошего дня

Ответы [ 2 ]

0 голосов
/ 11 июля 2010

Я предлагаю взглянуть на систему шаблонов на стороне клиента, как механизм, обсуждаемый здесь: http://blog.reybango.com/2010/07/09/not-using-jquery-javascript-templates-youre-really-missing-out/

Такой подход позволит вам отделить ваши CSS-фрагменты от кода, что будет намного чище. Вы поместили бы свой CSS в <script> блоки, которые специально созданы для «типа», чтобы браузер не пытался их выполнить.

0 голосов
/ 11 июля 2010

Я не знаю, может ли это помочь вам, а вместо того, чтобы динамически пытаться писать CSS, не можете ли вы создать разные стили и дать своим элементам правильный класс CSS при их рендеринге?

Как это:

div.even
{
  background-color:#f00;
}

div.odd
{
  background-color:#ff0;
}

Тогда вы можете определить правильную сторону сервера CSS-класса (с PHP, ASP.Net, ...) при рендеринге страницы.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...