javascript如何动态插入html元素呢?

主要有是两种方案:

?

1.使用DOM

? ?//使用createElement创建元素
? ? var dialog = document.createElement('div');
? ? var img = document.createElement('img');
? ? var btn = document.createElement('input');
? ? var content = document.createElement('span');
? ? // 添加class
? ? dialog.className = 'dialog';
? ? // 属性
? ? img.src = 'close.gif';
? ? // 样式
? ? btn.style.paddingRight = '10px';
? ? // 文本
? ? span.innerHTML = '您真的要GG吗?';
? ? // 在容器元素中放入其他元素
? ? dialog.appendChild(img);
? ? dialog.appendChild(btn);
? ? dialog.appendChild(span);
? ? ```
## 2.使用html template
``` javascript
var popContent =[
? ? ? ? ? ? ? ? '<li class="monitory-point-li" indexcode="00000000001310013631">',
? ? ? ? ? ? ? ? ? '<span class="checkbox-unchecked"></span>',
? ? ? ? ? ? ? ? ? '<span class="monitory-text" title="'+name+'">'+formedName+'</span>',
? ? ? ? ? ? ? ? '</li>'
? ? ? ? ? ? ? ? ].join(' ');
$('.document').append(popContent);
?
<div class="se-preview-section-delimiter"></div>

或者使用这种写法

var popContent =
? ? ? ? ? ? ? ? '<li class="monitory-point-li" indexcode="00000000001310013631">'+
? ? ? ? ? ? ? ? ? '<span class="checkbox-unchecked"></span>'+
? ? ? ? ? ? ? ? ? '<span class="monitory-text" title="'+name+'">'+formedName+'</span>'+
? ? ? ? ? ? ? ? '</li>';
$('.document').append(popContent);

javascript如何动态插入html元素呢?

?

文章链接: /11010.html

文章标题:javascript如何动态插入html元素呢?

文章版权:云服务器租用科技所发布的内容,部分为原创文章,转载请注明来源,网络转载文章如有侵权请联系我们!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

给TA打赏
共{{data.count}}人
人已打赏
建站教程投稿分享运维技术

Windows常用快捷键

2022-10-11 22:53:40

建站教程投稿分享

简述香港云服务器的演变和发展路径

2022-10-12 21:08:26

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧

云服务器租用科技 - 最新云主机促销服务器租用优惠

http://www.vxiaotou.com