js点击外部div实现内部a标签的方法_IT百科

1、首先需要引入jquery脚本文件。

2、其次添加一些简单的html，需要添加对应的点击事件函数，在函数中，先利用jquery的选择器方法来获取到a链接。

3、然后获取到链接后，就用一个for循环来得到div里所有链接的id，主要是通过jquery的attr方法来得到每个链接控件的id属性，得到后，将其保存进数组里，通过alert方法来d出显示所有链接的id。

4、最后在运行页面可以看到有二个链接，点击一下按钮，点击后，会d出一个alert窗口，这里显示出了二个链接的id属性，对比代码里的值，获取的结果是正确的即可。

解题：

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,d出数字

难点：

i的值，如果是全局作用域下的i,那么每次d出的都是循环的最后一个i

所以i的值，必须是快级作用域下的i 正好用es6中的let 来声明变量i

需要用document.createElement创建出来a标签。

<body>

</div>

</body>

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>

欢迎分享，转载请注明来源：内存溢出

js点击外部div实现内部a标签的方法