Question

JQuery的标准DOM等价物是什么

element.append("<ul><li><a href='url'></li></ul>")？

Answer 1

我认为您必须扩展innerHTML属性才能执行此操作

element[0].innerHTML += "<ul><li><a href='url'></a></li></ul>";

一些解释：

[0]，因为element是一个集合
+ =扩展innerHTML并且不覆盖
关闭</a>，因为某些浏览器只允许将有效的html设置为innerHTML

Answer 2

使用DOM操作，而不是HTML：

let element = document.getElementById('element');

let list = element.appendChild(document.createElement('ul'));
let item = list.appendChild(document.createElement('li'));
let link = item.appendChild(document.createElement('a'));

link.href = 'https://example.com/';
link.textContent = 'Hello, world';

<div id="element"></div>

Answer 3

来自jQuery源代码：

append: function() {
    return this.domManip(arguments, true, function( elem ) {
        if ( this.nodeType === 1 ) {
            this.appendChild( elem ); //<====
        }
    });
},

请注意，为了使其工作，您需要从字符串构造DOM元素，它是使用jQuery domManip函数完成的。

jQuery 1.7.2 source code

Answer 4

在纯JavaScript中复制Jquery追加方法的最简单方法是使用＆＃34; insertAdjacentHTML＆＃34;

    var this_div = document.getElementById('your_element_id');
    this_div.insertAdjacentHTML('beforeend','<b>Any Content</b>');

更多信息 - MDN insertAdjacentHTML

Answer 5

element.innerHTML += "<ul><li><a href='url'></li></ul>";

JS DOM等效于JQuery追加

5 个答案: