Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.06.2012, 12:54
Аватар для z700i
Аспирант
Отправить личное сообщение для z700i Посмотреть профиль Найти все сообщения от z700i
 
Регистрация: 15.10.2010
Сообщений: 77

изменение типа массива
Хотел сделать функцию которая добавляет элемент на страницу
Выглядит это как-то так:
function create(tag,params,parent){
    if(!tag)
        return 'tagName is null';
    var nevv =  document.createElement(tag);
    nevv.id = params.id;
    return (parent? parent : document.body).appendChild(nevv); 
}

create('div',
       {
           id:'newDiv',
           class:'className',
           style:{
               display:'none',
               width:'100px'
           }
       },
       ge('parent')
      )


Встретился с проблемой применения параметров(params), писать для каждого из них отдельную команду:
nevv.id = params.id? params.id : '';
nevv.class = params.class? params.class : '';
nevv.style.display = params.style.display? params.style.display : '';
nevv.style.width = params.style.width? params.style.width : '';
nevv.style.height = params.style.height? params.style.height : '';

Слишком объёмно и в плане работы, и в плане размера кода, да и работать, я подозреваю, будет не шибко быстро..
Можно ли сделать из ассоциативного массива многомерный и заполнить параметры существующими значениями с помощью цикла?
Ответить с цитированием
  #2 (permalink)  
Старый 18.06.2012, 13:03
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

function applyParams( obj, params ) {
    for( var key in params ) {

        if ( typeof params[ key ] === "object" ) {
            applyParams( obj[ key ], params[ key ] );
        } else {
            obj[ key ] = params[ key ];
        }
    }
}

function create( tag, params, parent ) {

    if ( !tag ) {
        return 'tagName is null';
    }

    var nevv =  document.createElement( tag );

    if ( params && typeof params === "object" ) {
        applyParams( nevv, params );
    }

    return ( parent || document.body ).appendChild( nevv );
}
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine

Последний раз редактировалось devote, 18.06.2012 в 13:05.
Ответить с цитированием
  #3 (permalink)  
Старый 18.06.2012, 14:53
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от melky
ещё проще.

засунул parent в params.parent, и tag в params. вместо копирования используется наследование. настройки "по-умолчанию" находятся в defParams.
чето ты ему совсем не то советуешь.. ему же свойства стилей и прочих свойств у элемента нужно менять.. а ты ему какой-то прототип советуешь, который будет жить сам по себе и не применяться к элементу его свойства.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #4 (permalink)  
Старый 18.06.2012, 15:07
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote Посмотреть сообщение
чето ты ему совсем не то советуешь.. ему же свойства стилей и прочих свойств у элемента нужно менять.. а ты ему какой-то прототип советуешь, который будет жить сам по себе и не применяться к элементу его свойства.
почему же не то? в вашем способе свойства объекта params переписываются в элемент, а у меня через прототип params получает "настройки по-умолчанию", чтобы везде не писать
params.parent||document.body
params.id||"defId"
params.style || {}

короче говоря, мой способ - то же самое, что и extend у jquery (с нек-и ограничениями)
Ответить с цитированием
  #5 (permalink)  
Старый 18.06.2012, 15:15
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

melky,
ок тогда объясни почему я не вижу дивака при твоем варианте?
<html>
<head>
</head>
<body>
<script>
var defParams = {
    parent: document.body,
    id: "",
    className: "default_class_for_created_elements"
};
 
function create(params){
    if (!params.tag) return;
    params.prototype = defParams;
    var nevv =  document.createElement(tag);
    nevv.id = params.id;
    nevv.className = params.className;
    return params.parent.appendChild(nevv); 
}
 
create('div',
       {
           id:'newDiv',
           className:'className',
           innerHTML: 'test',
           style:{
               //display:'none',
               width:'100px'
           }
       }
      )
</script>
</body>
</html>

А вот мой вариант:
<html>
<head>
</head>
<body>
<script>
function applyParams( obj, params ) {
    for( var key in params ) {
 
        if ( typeof params[ key ] === "object" ) {
            applyParams( obj[ key ], params[ key ] );
        } else {
            obj[ key ] = params[ key ];
        }
    }
}
 
function create( tag, params, parent ) {
 
    if ( !tag ) {
        return 'tagName is null';
    }
 
    var nevv =  document.createElement( tag );
 
    if ( params && typeof params === "object" ) {
        applyParams( nevv, params );
    }
 
    return ( parent || document.body ).appendChild( nevv );
}
 
create('div',
       {
           id:'newDiv',
           className:'className',
           innerHTML: 'test',
           style:{
               //display:'none',
               width:'100px'
           }
       }
      )
</script>
</body>
</html>
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #6 (permalink)  
Старый 18.06.2012, 15:26
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote
melky,
ок тогда объясни почему я не вижу дивака при твоем варианте?
потому что я в вызове забыл внести тег в хеш, и что-то намудрил с наследованием ...
Ответить с цитированием
  #7 (permalink)  
Старый 18.06.2012, 15:29
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от melky
потому что я в вызове забыл внести тег в хеш, и что-то намудрил с наследованием ...
да я вообще не понимаю как ты пытаешься прототипами добавить свойства элементу. Элемент не функция, она не может расшириться за счет прототипов, лишь только через window.Element ... а ты мудришь что-то странное, или просто я чего то не понимаю.

PS. Сделай пожалуйста рабочий пример того чего ты предлагаешь.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine

Последний раз редактировалось devote, 18.06.2012 в 15:40.
Ответить с цитированием
  #8 (permalink)  
Старый 18.06.2012, 15:43
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote
да я вообще не понимаю как ты пытаешься прототипами добавить элементы свойству. Элемент не функция, она не может расшириться за счет прототипов, лишь только через window.Element ...
я не расширяю элемент, я расширяю хеш опций. я забыл, что смешать 2 объекта таким образом не получится. простите, тупанул.
Ответить с цитированием
  #9 (permalink)  
Старый 18.06.2012, 16:02
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от z700i
да и работать, я подозреваю, будет не шибко быстро..
Cамое быстрое imxo - эт примитивный способ добавления параметров сразу в тег
var a ='<'+TAG+' '+ param1+'=' +valPar1+' '+ param1+'=' +valPar2+'></'+TAG+'>';
Легко организуется в цикл (Только для скорости не сходу добавляем на страницу, а формируем некую переменную всех текущих добавляемых и только потом всовываем
Ответить с цитированием
  #10 (permalink)  
Старый 18.06.2012, 16:14
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от Deff
Только для скорости не сходу добавляем на страницу, а формируем некую переменную всех текущих добавляемых и только потом всовываем
ну дык он же добавляет свойства еще не вставленному элементу в DOM дерево, поэтому скорость от этого не сильно падает.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Из массива в строку Smoke332 Javascript под браузер 4 06.08.2019 08:57
Как обработать изменение масштаба окна в IE8 ? v_k Events/DOM/Window 1 09.08.2010 13:35
Как проверить название массива? Andrej_2 Общие вопросы Javascript 2 30.06.2010 21:07
Можно ли как для произвольного массива создавать вызовы функций , имеющих на входе kefi Общие вопросы Javascript 3 17.04.2009 16:53
вставка элементов массива в текстовую форму по клику olezyk Общие вопросы Javascript 3 21.03.2009 22:01