插入后不会附加每个元素

时间:2016-12-19 12:55:21

标签: javascript jquery append appendchild

function $(selector) {

    var resultObject = {
        append: function (element) {
            var parser = new DOMParser();
            var dos = parser.parseFromString(element, "text/html");

            var all = dos.getElementsByTagName("body")[0];
       

            var elemWhichAppend = document.getElementsByClassName("testing");

            var children = all.childNodes;
            for (var i = 0; i < elemWhichAppend.length; i++) {
                
                for (var child = 0; child < children.length; child++) {
                    var al = myLo(children[child]);
                    insertAfter(al, elemWhichAppend[i]);
                }
            }
            

        }
    }
    return resultObject;
}

function insertAfter(newNode, referenceNode) {
    referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}

function myLo(curElem)
{

    var whichnodetype;

    if (curElem.nodeType == 3)
    {
        whichnodetype = document.createTextNode(curElem.nodeValue);
    }
    else
    {
        var whichnodetype = document.createElement(curElem.nodeName);
    }

    var children = curElem.childNodes;
    for (var child = 0; child < children.length; child++) {
        whichnodetype.appendChild(children[child]);
    }

    return whichnodetype;
}
<!DOCTYPE html>
<html>
<head>
    <title></title>
	<meta charset="utf-8" />
</head>
<body>
    <h1 class="testing">APPEND</h1>
    <p>Hallo, ich bin ein P TAG </p>
    <h2 class="testing">APPEND2</h2>
    <input type="button" value="append tag/text " onclick="$('.testing').append('<ul><li>RIBA RIBI<ul><li>FRANK RIBERY</li></ul></li></ul><h1>NIGOGOG</h1> messi ist scheiße');" />
</body>
</html>

输出应该是h标签之后的列表,而不是文本的标签。但是在输出端,它附加的第一个测试反向,在第二个测试类中,它仅附加第一个测试。

0 个答案:

没有答案