标题
[js/ts] html 中动态创建节点的方法
clq
浏览(429) +
2023-04-12 09:20:31 发表
编辑
关键字:
[js/ts] html 中动态创建节点的方法
一直用的 jquery 。
//添加一个元素节点
var p = document.createElement("p");
// var p = document.createElement("div");
document.body.appendChild(p);
p.innerHTML = 'aaabbb';
//---------------------------------
这当中的关键点是要在 document.body 中加子节点，否则它只存在于内存中并不会显示。
--------------------------------------------------------
https://blog.csdn.net/weixin_55992854/article/details/117112802
里面还有一个方便的添加 css 的方法，这样基本上就可以不用 jquery 了。
//添加一个元素节点
var p = document.createElement("p");
//创建一个文本节点，并向p标签中添加这个文本节点(文本也是节点)
var p_text = document.createTextNode("这是新增的p标签");
p.appendChild(p_text);
//创建一个属性节点，并添加到元素上
var p_align = document.createAttribute("align");
p_align.value = "center";
p.setAttributeNode(p_align);
var p_style = document.createAttribute("style");
p_style.value = "color:red;font-size:20px;";
p.setAttributeNode(p_style);
//将元素节点添加到body之内
document.body.appendChild(p);
//创建一个注释节点并添加在body，但注释在页面上是看不见的
var c = document.createComment("这是一个注释节点");
document.body.appendChild(c);
--------------------------------------------------------
而单纯的 document.write('ttt'); 这样会清空原有的内容，目前的流行趋势是很不推荐。
NEWBT官方QQ群1: 276678893
可求档连环画,漫画;询问文本处理大师等软件使用技巧;求档softhub软件下载及使用技巧.
但不可"开车",严禁国家敏感话题,不可求档涉及版权的文档软件.
验证问题说明申请入群原因即可.
