jQuery - получить CSS из всего, что есть внутри div - PullRequest
Новая
       4

jQuery - получить CSS из всего, что есть внутри div

1 голос
/ 21 июня 2010

Допустим, у меня есть некоторый HTML-код, подобный этому 

<html>
<body>
    <div class="container">
    <div class="markup-container">
        <div class="title">This is a title with some markup</div>
        <div class="body">This is the body with some markup and it's longer ^^</div>
    </div>
    </div>
</body>
</html>

, и мой CSS выглядит следующим образом 

.container{display:none;}
.markup-container{color:#404040;}
.title{text:decoration:underline;}
.body{color:#000;}

Как мне заставить мой javascript читать весь CSS, используемый вконтейнер класса (включая дочерние элементы).

Я хочу, чтобы он отображался так же, как это было написано в css, и помещал его в переменную, например: 

var css = "<style type="text/css">.container{display:none;}.markup-container{color:#404040;}.title{text:decoration:underline;}.body{color:#000;}"

Как бы ясделать это?

Ответы [ 2 ]

2 голосов
/ 21 июня 2010

С простым JavaScript вы можете сделать следующее: 

var styleSheet = document.styleSheets[0]; //first stylesheet.
var css='<style type="text/css">';
for(i=0; i<styleSheet.cssRules.length; i++)
 {
    css += styleSheet.cssRules[i].cssText;
 }
css = css + "</style>";
1 голос
/ 21 июня 2010

Когда вы используете метод jQuery css, вы сохраняете CSS таким образом, чтобы его можно было легко применить к другому элементу. Было бы особенно скучным, обычно непрактичным и необычным получить CSS для нескольких селекторов и сохранить его в одной переменной.

Вы можете получить одно свойство CSS одного селектора с помощью jquery, например: 

var css = $('.container').css('display');

Самый простой метод хранения CSS в виде строки потребует от вас иметь CSS в том же месте, что и HTML (т.е. не в отдельном файле CSS). Вы можете сохранить CSS как строку, добавив к ней идентификатор, например: 

<style id="my_css" type="text/css">
    .container{display:none;}
    .markup-container{color:#404040;}
    .title{text:decoration:underline;}
    .body{color:#000;}
</style>

и затем сохраните этот текст в своем javascript с помощью 

var css = $('#my_css').text();

У меня есть пример этого в действии здесь - http://jsbin.com/umire3

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

Нет похожих вопросов

...