Как добавить код в head и body
Доброго времени!
Как добавить в head стили, а в body используя цикл дописать детей
function _columns(a)
{
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.column_ { position: fixed; z-index: 999; top: 0; display: block; height: 100%; border-right: 1px dashed #4affff; } * html .column_ {position: absolute; }';
document.getElementsByTagName("head").appendChild(style);
for (var i = 0, l = a.length; i < l; i++)
var line = document.createElement('span');
line.class = 'column_';
line.style = 'left:' + a[i] + '%'
document.getElementsByTagName("body").appendChild(line);
}
пытаюсь сделать как то так, но выскакивает ошибка Цитата:
|
TicTac,
Примерно так )))
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
window.onload = function () {
function _columns(d) {
var a = document.createElement("style"),
c = ".column_ { position: fixed; z-index: 999; top: 0; display: block; height: 100%; border-right: 1px dashed #4affff; } * html .column_ {position: absolute; }";
a.setAttribute("type", "text/css");
a.styleSheet ? a.styleSheet.cssText = c : (c = document.createTextNode(c), a.appendChild(c));
document.getElementsByTagName("head")[0].appendChild(a);
a = 0;
for (b = d.length; a < b; a++) c = document.createElement("span"), c.className = "column_", c.style.left = d[a] + "%", document.body.appendChild(c)
};
_columns([10,20,30,40,50])
};
</script>
</head>
<body>
</body>
</html>
|
Цитата:
ясное дело, будет выскакивать смотри внимательно на подчеркнутое
function _columns(a)
{
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.column_ { position: fixed; z-index: 999; top: 0; display: block; height: 100%; border-right: 1px dashed #4affff; } * html .column_ {position: absolute; }';
document.getElementsByTagName("head").appendChild(style);
for (var i = 0, l = a.length; i < l; i++)
var line = document.createElement('span');
line.class = 'column_';
line.style = 'left:' + a[i] + '%'
// забыл [0]
*!*document.getElementsByTagName("body")[0].appendChild(line);*/!*
}
|
рони,melky, спасибо, заработало :)
|
или
document.body.appendChild(line); это работает только для body, для head по прежнему нужно выбирать по TagName. |
Magneto, ага видел такой подход
можно еще такой вопросик, в массиве есть два параметра в данном случае мне нужен первый, который содержит название css декларации, код line.style.pers_param[0] = a[i]; не работает, а если сделать так var av = pers_param[0]; line.style.av = a[i]; работает, можно как-то все таки заставить брать значение из массива, чтобы не создавать отдельную переменную для этого... хотя нет, тоже не работает , ошибок не выдает, но ожидаемого например left из массива line.style.left и выполнения line.style.left = ... ничего не происходит, не добавляется декларация left ( |
TicTac,
line.style[pers_param[0]] = a[i]; |
рони, уго) работает:dance: спасибо большое
|
рони,
а зачем нужна эта проверка для кроссбраузерности? a.styleSheet ? a.styleSheet.cssText = c : (c = document.createTextNode(c), a.appendChild(c)); я у себя использовал style.innerHTML как-то в хроме сработало так и оставил, а когда открыл в ие7,8 обломался - не работает, а если сделать с такой проверкой как у Вас все отлчно работает даже в ие :) спасибо |
TicTac,
немного покороче можно a.styleSheet ? a.styleSheet.cssText = c : a.textContent = c; |
| Часовой пояс GMT +3, время: 03:30. |