2013-09-24 3 views
3

Я сомневаюсь, что это возможно, но я все равно спрошу.Render HTML в Javascript без изменения DOM

Предположим, у меня есть собственный тег HTML «location», который я хочу сделать определенным образом, без фактического изменения DOM.

Например: <location loc-id="14" address="blah" zipcode="14" />

оказать бы эквивалент:

<div class="location"> 
    <div>Blah></div> 
    <div>14></div> 
</div> 

Я знаю, что я мог бы извлечь данные из атрибутов, а также создавать новые элементы DOM соответственно, но я хотел бы сделать это без фактического добавления/редактирования DOM.

Опять же, я сомневаюсь, что это возможно, но я решил, что спрошу.

+1

DOM-является основой макета страницы. Что бы вы ни делали, вы не можете изменить его, не меняя другого. –

+1

нет ... вы не можете этого сделать .... без изменения dom ... –

+1

Вам нужно изучить [материал X-Tag] (https://hacks.mozilla.org/2013/05/ скорость вверх-приложение-разработка-с-х-Таг-и-веб-компоненты /). Вы * можете * (или, по крайней мере, вы скоро сможете) сделать это без необходимости ретроактивно выполнять операцию на DOM, и я думаю, что это вроде того, что вы имеете в виду здесь. – Pointy

ответ

0

Вы можете использовать CSS: до и: после псевдо элементы, чтобы сделать это:

<style> 
    location:before { 
    content: attr(address); 
    text-transform: capitalize; 
    display: block; 
    } 

    location:after { 
    content: attr(zipcode); 
    display: block; 
    } 
</style> 
<location loc-id="14" address="blah" zipcode="14" /> 

Показывает, как:

Blah 
14 
+0

Это достаточно отвечает на вопрос, как было задано. Благодаря! –

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