JS中创建节点和插入节点
1、JS中添加段落的三种方式
第一种方式:通过createTextNode 来添加段落文本
function addP() {// 第一种方式var p = document.createElement("p");var txt = document.createTextNode("将来的你会感谢现在奋斗的自己");p.appendChild(txt);document.getElementById("container").appendChild(p);}
第二种方式:通过innerHTML来添加文本
function addP() {// 第二种方式var container = document.getElementById("container");var p = document.createElement("p");p.innerHTML = "未来的你会感谢现在拼命的自己";container.appendChild(p);}
第三种方式:
function addP() {// 第三种方式var container = document.getElementById("container");var str = "未来的你会感谢现在拼命的自己
";container.innerHTML = str;}
JS添加图片的三种方式
第一种方式:用.style进行设置属性
function addImg() {var img = document.createElement("img");img.src = "img/Daniel_Wu.jpg";img.style.width = "300px";img.style.height = "200px";var container = document.getElementById("container");container.appendChild(img);}
第二种方式:(用setAttribute进行设置属性)
function addImg() {var img = document.createElement("img");img.setAttribute('src','img/Daniel_Wu.jpg');img.setAttribute('style','width: 300px ;height: 200px;');var container = document.getElementById("container");container.appendChild(img);}
第三种方式:(用innerHTML进行添加)
function addImg() {document.getElementById("container").innerHTML="
";}
JS中添加文本框的三种方式
第一种:(通过createElement创建)
function addText() {var txt = document.createElement("input");txt.type = "text";txt.value = "新增文本框";var container = document.getElementsByTagName("div")[0];container.appendChild(txt);}
第二种:通过setAttribute进行设置属性
function addText() {var txt = document.createElement("input");txt.setAttribute("type","text");txt.setAttribute("value","这是新的文本框");var container = document.getElementsByClassName("container")[0];container.appendChild(txt);}
第三种:通过innerHTML进行创建
function addText() {document.getElementsByClassName("container")[0].innerHTML = "";}
JS添加option选项框的三种方法
1、通过.的方式进行设置属性
function addOptions() {var opt = document.createElement("option");opt.value = "3";opt.text = "来自天堂的魔鬼";var music = document.getElementsByName("music")[0];music.appendChild(opt);}
2、通过.options.add的方法进行添加
function addOptions() {var opt = document.createElement("option");opt.value = "4";opt.text = "泡沫啊啊啊";var music = document.getElementsByName("music")[0];music.options.add(opt);}
3、通过innerHTML的方法进行添加,注意是 options是 += 而不是 =
function addOptions() {document.getElementsByName("music")[0].innerHTML += "";}
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
