开发者

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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜