案例一
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<ul id="heroes">
<li>安琪拉</li>
<li>李白</li>
<li>诸葛亮</li>
<li>狄仁杰</li>
</ul>
<script>
var heroes = document.getElementById('heroes');
var list = heroes.children;
for (var i = 0; i < list.length; i++) {
var li = list[i];
(function (i) {
li.onclick = function () {
console.log(i);
}
})(i);
}
</script>
</body>
</html>
案例二
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
我是字体的演示
<div id="box">
<button size="12">按钮1</button>
<button size="14">按钮2</button>
<button size="16">按钮3</button>
</div>
<script>
function makeFun(size) {
return function () {
document.body.style.fontSize = size + 'px';
}
}
var box = document.getElementById('box');
var buttons = box.children;
for (var i = 0; i < buttons.length; i++) {
var btn = buttons[i];
var size = btn.getAttribute('size');
btn.onclick = makeFun(size);
}
</script>
</body>
</html>
Processed:
0.015, SQL:
8
