17.02.2013, 11:26
|
|
Новичок на форуме
|
|
Регистрация: 17.02.2013
Сообщений: 3
|
|
|
добавить атрибут динамически
Здравствуйте. вобщем есть у меня конструкция, которая явно не правильная... помогите правильно составить, пожалуйста...
так я намудрил потому, что не знаю, какие параметры могуть быть переданы. И давать им значения по умолчанию тоже не получится, так как их куча...
a[1] - объект с параметрами элемента. Соответственно a[1]["style"] - стили, там могут быть width, height, background ну и так далее.
передается это как то типа style : {width : "100px", height : "200px", background : "#32cd32"}
Так вот как мне присвоить элементу все эти стили?
if(a[1]["style"]){
for(i in a[1]["style"]){
arr.push(i) // название стиля
arr2.push(a[1]["style"][i]) // значение стиля
}
for(i in arr){
var styleName = arr[i]
var styleVal = arr2[i]
newElem.style.styleName = styleVal
}
}
|
|
17.02.2013, 11:40
|
 |
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
|
z-z,
на jquery $(a[1]).css(a[1]["style"])
|
|
17.02.2013, 11:58
|
 |
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
рони, ну ты даешь! Ты тоже jQuery-зомби?
z-z,
for(i in arr){
var styleName = arr[i]
var styleVal = arr2[i]
newElem.style[styleName] = styleVal
}
А к чему эти переливания из пустого в порожнее? Вот так это делается:
var style = a[1]["style"] || {};
for(var property in style){
newElem.style[property] = style[property];
}
Последний раз редактировалось danik.js, 17.02.2013 в 12:01.
|
|
17.02.2013, 12:03
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
|
for(i in arr) .. - верный знак того, что человек не умеет делать отладку скрипта. Ибо отслеживать глобальную переменную в отладчике неудобно.
|
|
17.02.2013, 12:06
|
|
Новичок на форуме
|
|
Регистрация: 17.02.2013
Сообщений: 3
|
|
danik.js,
спасибо. сам до этого дошел сразу после того, как пост создал))
еще вопрос есть.. объект в целом передает так же атрибуты типа названия класса и айди... я проверяю циклом и исключаю style, чтобы потом его отдельно обработать...
но как мне таким же образом какой нибудь обработчик передать?
айди смог прикрепить, а вот обработчик никак не хочет прикрепляться...
например как то типа
newElem("div", {
id : "newId",
style : {
//тут стили
},
onclick : "zz()"
})
|
|
17.02.2013, 12:11
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
z-z, не путай атрибуты со свойствами
newEl.onclick = zz - это свойство, желательно делать так.
newEl.setAttribute('onclick', 'zz()') - это атрибут, нежелательно использовать
newElem("div", {
id : "newId",
style : {
//тут стили
},
onclick : zz
})
Вот так делай.
|
|
17.02.2013, 12:12
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
тогда так
for (var i=0; i<arr.length; i++) {
if (arr[i]["style"]){
var style = arr[i]["style"];
var newElem = arr[i];
for(var property in style){
newElem.style[property] = style[property];
}}}
ну и учитывать что background-color = backgroundColor |
|
17.02.2013, 12:15
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
|
z-z, посмотри как это сделано в MooTools или jQuery.
|
|
17.02.2013, 12:23
|
|
Новичок на форуме
|
|
Регистрация: 17.02.2013
Сообщений: 3
|
|
danik.js,
хорошо. допустим строка выглядит так
addElem("div",
{
id : "newId",
className : "newClass",
style :
{
width : "100px",
height: "200px",
background : "#32cd32"
},
onclick : zz
})
а как мне это внутри функции addElem обработать? я прохожусь по свойствам объекта и есть там есть свойство style, обрабатываю его отдельно... и все получается нормально) а вот как добавить обработчик? не так, чтобы обработчик работал в пределах только этого скрипта, а так, чтобы у элемента был полноценный обработчик... что-то типа
<div id="newId" onclick="zz()"></div>
|
|
17.02.2013, 12:54
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
<body>
<script>
function zz(e) {
alert('click handler');
}
addElem("div",
{
id : "newId",
className : "newClass",
textContent: 'Нажми меня',
style :
{
width : "100px",
height: "200px",
background : "#32cd32"
},
onclick : zz
})
function addElem(tag, properties) {
var element = document.createElement(tag);
for (var property in properties) {
switch (property) {
case 'style':
(function(style) {
for (var property in style) {
element.style[property] = style[property];
}
})(properties[property]);
break;
default:
element[property] = properties[property];
}
}
return document.body.appendChild(element);
}
</script>
</body>
|
|
|
|
