2012-01-04 3 views
3

Мне интересно, можно ли изменить тип данных элементов HTML с помощью javascript?Динамическое изменение типа элементов HTML

Например, измените img на div? Причина, по которой я делаю это &, не разрушая img &, создавая div, потому что элемент содержит много встроенного стиля, поэтому мне нужно будет скопировать весь встроенный стиль из img в div. PS: этот сайт предназначен только для iPad, поэтому кросс-браузерная совместимость не является проблемой.

var div = img.cloneNode(true); 
div.type = "div"; 

Так было бы легче клонировать/элемент узла с помощью img.cloneNode (истина), то необходимо изменить тип к DIV. Надеюсь, это возможно?

Если нет, возможно, есть простой способ скопировать один стиль элементов в другие элементы? Может быть ...

// img is an img HTML element 
var div = document.createElement("div"); 
div.style = img.style; 
document.body.removeChild(img); // does that destroy div.style aswell? 
+2

Вы не можете изменить элемент из одного «типа» в другой, но вы можете скопировать свойство стиля из одного в другое, чтобы скопировать встроенный стиль. Однако эффект может быть не таким. – RobG

+0

Возможный дубликат [как изменить тип элемента с помощью jquery] (https://stackoverflow.com/questions/8584098/how-to-change-an-element-type-using-jquery) – C8H10N4O2

ответ

1

Вы не можете изменить тип элемента. Да, стиль div будет перезаписан, если вы не объедините div.style + = img.style. В этом случае атрибуты стиля img переопределяют div.

+1

Это скопирует объект img.style ** ** в div, а не в атрибуты. – RobG

2

Я хотел бы попробовать второй способ - я думаю, что это должна работа, и она должна быть очень быстро, чтобы попробовать его - вероятно, быстрее, чем спрашивать здесь был!

Редактировать: Я могу подтвердить, что он НЕ работает (по крайней мере, не в Opera). JSFiddle at http://jsfiddle.net/T7r5c/

+1

http: // jsfiddle. net/T7r5c/1/'elem.style.cssText' - это то, что вам нужно. Но inline-css - это зло. Просто дайте двум элементам общий класс или общий селектор. – Zirak

+0

Только что опубликовал этот ответ, когда я увидел ваш комментарий. Я удалил ответ. – Sandro

+0

Согласитесь, встроенный css - это плохо. Возможно, ваш метод, PLUS, копирует классы, будет лучшим выбором. Зависит от сайта. Другой вариант может состоять в том, чтобы пропустить объект .style и применить каждый стиль отдельно. Однако Messy: S – SpoonNZ

Смежные вопросы