想要在页面动态添加元素，首先要确定在哪个元素后面添加元素，然后利用js的appendChild方法在该元素后面追加元素。
1.获取父节点元素varbody=document.getElementsByTagName('body')[0]。
2.然后动态创建a标签vara=document.createElement('a')。
3.把创建好的a标签追加到body下面body.appendChild(a)。
4.在a标签里面添加文本内容a.innerHTML='这是一个链接'。
5.给a标签添加一个链接a.href='https://www.baidu.com/'。
扩展资料：
js一些原生方法
element.appendChild()方法向节点添加最后一个子节点。
element.innerHTML设置或返回元素的内容。
document.getElementsByTagName()返回带有指定标签名的对象集合。
document.getElementById()返回对拥有指定id的第一个对象的引用。
document.createElement()通过指定名称创建一个元素。
使用JS的document.getElementById("ID").innerHTML获取标签内容。修改的只需在后面加上"="即可。
实例演示如下：
一、HTML的DOM设计。
1、设计两个DIV，其中第一个div放入入一些文字。
2、设计css样式如下，为了区分明显，加了border。
3、此时的页面展示如下：
二、函数功能的设计和绑定。
1、设计函数，实现赋值和删除的功能。
2、然后在两个button上分别绑定函数：
三、功能演示。
1、设计完成，点击【复制内容】，此时页面展示如下：（两个div内容已相同）。
2、此时点击【删除内容】，展示如下：内容再次被删除，恢复空白。
扩展资料：
HTML DOM innerHTML 属性：
1、定义和用法：innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
2、语法：tablerowObject.innerHTML=HTML。
第一种方法：输出html
1、<body onload="s()">
2、<span id="hello"></span>
3、<script language="javascript">4、function s()
5、{document.getElementById("hello").innerHTML = "<iframe src= height=400 width=300></iframe>"}
6、</script>第二种方法：输出文本
1、<body onload="s()">
2、<span id="hello"></span>
3、<script language="javascript">4、function s()
5、{document.getElementById("hello").innerText = "hello world"}
6、</script>在页面加载完成后通过jquery给多个span赋值
扩展资料
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。
Javascript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。
参考资料：百度百科-javascript
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）