Sam-Bo
Sam-Bo

Reputation: 829

Duplicate an element?

I'm trying to duplicate an element in a page. I do not exactly how, is it possible with CSS or I need to use a script?

I imagine something like this:

  #yan:before { 
    content: Get The Value Of(AN.element.inPage) !important;
    font-size: 200% !important;
    }

E.G.: Let's say I want to get the title of a topic.

  #yan:before { 
    content: Get The Value Of(h1.subject) !important;
    font-size: 200% !important;
    }

Then the topic title would appear 2 times in the page. Is it possible?

NOW This is my RIGHT code...

// ==UserScript==
// @name        DUPLICATING - CLONE elements
// @namespace   http://userscripts.org/scripts/show/109262
// @description    EXPLAIN ME PLEASE
// @include     http*://*answers.yahoo.com*
// @version     1
// ==/UserScript==


var yan = document.getElementById('yan'),
h1s = document.querySelectorAll('h1.subject');

[].forEach.call(h1s, function(node) {
// insert before
yan.parentNode.insertBefore(node.cloneNode(true), yan);
});

►►►► BUT now how do I set a position relative to the "#yan-related" element?? ►►►► I want the newly created element to follow the #yan-related.

Upvotes: 0

Views: 4492

Answers (3)

Ja͢ck
Ja͢ck

Reputation: 173652

This is only possible with script, e.g.

var yan = document.getElementById('yan'),
h1s = document.querySelectorAll('h1.subject');

[].forEach.call(h1s, function(node) {
    // insert before
    yan.parentNode.insertBefore(node.cloneNode(true), yan);
});

Demo

Upvotes: 5

Akshar Raaj
Akshar Raaj

Reputation: 15231

You will have to use jquery. Check clone()

var a = $("#dashnav").clone
$("#dashnav").after(a)

Upvotes: 3

Samuel Liew
Samuel Liew

Reputation: 79093

No, CSS is for layout purposes, and cannot clone HTML elements. You will have to use JavaScript/jQuery for this purpose.

See related question on how to use .clone():

Is it possible to clone html element objects in JavaScript / JQuery?

Upvotes: 0

Related Questions