发表于： 2020-09-13 23:59:50
0 1746
今天完成的事情：
学习js向html指定位置添加元素的方法
window.onload = function () {
// 创建一个div节点，添加到#one下
for (index = 0; index < arr.length; index++) {
myClick("btn2", function () {
// 创建div元素节点
/* document.createElement();
可以创建一个元素节点对象
需要一个标签名作为参数，将会根据该标签名创建元素节点，并将创建好的对象作为返回值返回
*/
var span = document.createElement("span");
// 创建广州文本节点
/* document.createTextNode
创建文本节点对象
需要一个文本内容作为参数，根据该内容创建文本节点，并将新的节点返回
*/
var playerText = document.createTextNode(index + "身份");
// 将playerText设置span的子节点
/* appendChild()
向一个父元素中添加一个新的节点
语法： 父节点.appendChild(子节点)
*/
span.appendChild(playerText);
// 获取id为one的节点
var one = document.getElementById("one");
//
one.appendChild(span);
});
myClick("btn2", function () {
var span = document.createElement("span");
var gzText = document.createTextNode(index + "身份");
span.appendChild(gzText);
// 获取id为one的节点
var one = document.getElementById("one");
// 获取one
var box = document.getElementById("box");
/* insertBefore()
可以在指定的子节点前插入新的子节点
语法：父节点.insertBefore(新节点,旧节点);
*/
box.insertBefore(span, one);
});
}
};
function myClick(idStr, fun) {
var btn = document.getElementById(idStr);
btn.onclick = fun;
}
返回列表
评论