how to preserve style when cloning a node
I want to take an html document (a book chapter) and separate it into pages (an array of DIV, each c开发者_运维技巧ontaining a page of html content that will fit within the prescribed dimensions of the DIV). I walk the DOM with the following code (found on this site!).
function walk(node, func)
{
func(node);
node = node.firstChild;
while (node)
{
walk(node, func);
node = node.nextSibling;
}
};
The func function is called test and is below.
function test(node)
{
var copy=node.cloneNode(false);
currentPageInArray.appendChild(copy);
//Test if we still fit
if( $(currentPageInArray).height() <= maxPageHeight )
{
//All good
}
else
{
//We dont fit anymore
//Remove node that made us exceed the height
currentPageInArray.removeChild(copy);
createNewPage();
currentPageInArray.appendChild(copy); //into new page
}
}
My pages get generated correctly, however, I lose all styles such as italic, bold, headers, etc. If I try clone(true), many elements get duplicated multiple times. How can I fix this? Thanks in advance.
You may retrieve the current layout of every element using currentStyle(IE<9) or getComputedStyle(Others) and apply it to the cloned elements.
精彩评论