Китайский секрет от меня!
Все люди мучаются над созданием элементов! (точнее создали, но нужны еще аттрибуты).
Но это в прошлом! Теперь есть универсальный скрипт (китайский секрет от меня).
//перменная i в цикле означает название атрибута
//а переменная attr[i] означает значение атрибута
var DOMCreateElement = function(elem,attr){
var element = document.createElement(elem);
if(attr==null){attr={}}
for(var i in attr){
element.setAttribute(i,attr[i]);
}
return element;
};
var attributes = {
"src":"image.png"
}
var img = DOMCreateElement("img",attributes);
Все - создали элемент! |
Цитата:
var element = document.createElement('…');
element.property = value;
Я уже не говорю о том, что все люди используют фреймворке, где это выглядит ещё проще. |
Цитата:
|
Да вы не поняли!
Так можно много аттрибутов использовать! var video = DOMCreateElement("video",{ "autoplay":"autoplay", "loop":"loop", "width":"100", "height":"100", "src":"video.ogv" }); |
var video = document.createElement('video');
Object.mixin(video, {
"autoplay":"autoplay",
"loop":"loop",
"width":"100",
"height":"100",
"src":"video.ogv"
})
|
Че за Object.mixin ???
|
Скажи что за фреймворк?
|
|
Kolyaj, он сейчас подумает, что это реально штука из фреймворка, и так и не поймет, что это просто mixin, один из способов расширения/наследования объектов в языке, в котором нету классов. Надо было его отправить читать Стефанова.
|
Цитата:
|
Ну да, все-таки копирование - не наследование.. неверно выразился
|
Object.updateTree = function updateTree(obj, src) {
if (obj == null) {
obj = {};
}
for (var key in src) {
if (typeof obj[key] == 'object' && typeof src[key] == 'object') {
updateTree(obj[key], src[key]);
} else {
obj[key] = src[key];
}
}
return obj;
};
var elem = Object.updateTree(document.createElement('div'), {
style: {
fontSize: '200%',
cursor: 'pointer'
},
onclick: function() { alert('click!'); },
innerHTML: 'click me'
});
document.body.appendChild(elem);
|
Ну и секреты у вас!
Но вы тупо используете свойство: elem[attr] = prop[attr]; Где: attr - это сам атрибут elem - элемент prop - своство атрибута элемента |
Оказывает у вас мозга больше!
Но вот мой вариант.
Object.mix = function(obj,attr){
if(obj==null){obj={}}
if(attr==null){attr={}}
for(var i in attr){
obj[i] = attr[i];
}
}
Но:
Object.mix = function(obj,attr){
if(obj==null){obj={}}
if(attr==null){attr={}}
for(var i in attr){
obj.setAttribute(i,attr[i]);
}
}
Оригинальнее для DOM. |
Но для манипуляции со стилями:
Object.mix = function(obj,attr){
if(obj==null){obj={}}
if(attr==null){attr={}}
for(var i in attr){
obj.style.setProperty(i,attr[i],null);
}
}
Есть такой - более верный вариант! |
Здесь: корректно работает "background-image" вместо "backgroundImage"
|
Я прошу закрыть тему т.к. ни к чему хорошему это обсуждение не приведет! Одни пишут свое в ответ другому!
|
Цитата:
|
1. Мы добавляем атрибуты в HTML элемент (подойдет в SVG).
2. Насчет CSS - то здесь все легко и просто, и даже кроссбраузерно. 3. Позаимствовал, зато работает в IE и других браузерах.
(function(window){
window.setAttributes = function(obj,src){
if(obj==null){obj={}}
if(src==null){src={}}
for(var i in src){
obj.setAttribute(i,src[i]);
}
}
window.setStyles = function(obj,src){
if(obj==null){obj={}}
if(src==null){src={}}
for(var i in src){
if(typeof obj.style.setProperty != "undefined"){
obj.style.setProperty(i,src[i],null);
} else {
obj.style.setAttribute(i,src[i]);
}
}
}
window.addEvent = function(obj, type, func) {
if(obj.addEventListener) {
obj.addEventListener(type, func, false);
}
else
if(obj.attachEvent) {
var f = function(e) {
func.call(obj, e);
}
obj.attachEvent('on' + type, f);
}
}
})(window);
|
Что говоря об SVG:
window.setAttributesNS = function(obj,ns,src){
if(obj==null){obj={}}
if(src==null){src={}}
for(var i in src){
obj.setAttribute(ns,i,src[i]);
}
}
|
Цитата:
|
Octane, нет.
|
| Часовой пояс GMT +3, время: 17:41. |