for (let i = 1i <= 10i++) {
let a = document.createElement('a')
a.innerHTML = i + '<br>'
document.body.appendChild(a)
a.addEventListener('click', function(e) {
e.preventDefault()
alert(i)
})
}
如图：
结题思路
1、创建10个a标签，肯定是先创建一个a标签，通过通过循环的方式，将数字1-10 赋值给a
2、点击a,弹出数字
难点：
i的值，如果是全局作用域下的i,那么每次弹出的都是循环的最后一个i
所以i的值，必须是快级作用域下的i 正好用es6中的let 来声明变量i
想要在页面动态添加元素，首先要确定在哪个元素后面添加元素，然后利用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()通过指定名称创建一个元素。
需要用document.createElement创建出来a标签。<body>
<div style="width:100px height:100px border:1px solid #ccc">
</div>
</body>
<script>
var oDiv = document.getElementsByTagName('div')[0]
var oA = document.createElement('a') //创建a标签
oA.href = '#' //增加a标签的href属性
oA.innerHTML = '11111111' //给a标签添加内容
oDiv.appendChild(oA) //将a标签添加到div里面
</script>
</html>
