DOM 事件绑定
<style>
.@R_702_2@ {
width: px;
height: px;
background: green;
}
</style>
<div class="@R_702_2@" onclick="alert('耶耶耶耶耶！')"></div>
<script>
function load() {
alert('加载完毕啦！');
}
</script>
<body onload="load()">
<div>我是一段滥竽充数文案。</div>
</body>
<style>
.btn {
border: px solid #4caf50;
font-size: px;
padding: px px;
color: #4caf50;
outline: none;
}
.btn:active {
background: #eee;
}
</style>
<button class="btn">
我是可以改变一切的按钮
</button>
<script>
var btn = document.querySelector('.btn');
btn.onclick = function() {
var text = btn.innerText;
btn.innerText = text.replace('一切', '世界');
};
</script>
<style>
.btn {
border: px solid #4caf50;
font-size: px;
padding: px px;
color: #4caf50;
outline: none;
}
.btn:active {
background: #eee;
}
p {
font-size: px;
}
</style>
<button class="btn">
我是可以改变一切的按钮
</button>
<p>1</p>
<script>
var btn = document.querySelector('.btn');
var p = document.querySelector('p');
var total = ;
btn.onclick = function() {
p.innerText = ++total;
if (total >= ) {
btn.onclick = null;
}
};
</script>
<style>
.btn {
border: px solid #4caf50;
font-size: px;
padding: px px;
color: #4caf50;
outline: none;
}
.btn:active {
background: #eee;
}
input {
padding: px px;
font-size: px;
outline: none;
}
p {
font-size: px;
}
</style>
<input type="text">
<button class="btn">
按钮
</button>
<p>1</p>
<script>
var btn = document.querySelector('.btn');
var input = document.querySelector('input');
var p = document.querySelector('p');
var total = ;
btn.addEventListener('click', function() {
input.value = input.value.split('').reverse().join('');
btn.value = input.value;
p.innerText = input.value;
});
input.addEventListener('keyup', function() {
btn.innerText = input.value;
});
</script>
<style>
.btn {
border: 1px solid #4caf50;
font-size: 14px;
padding: 8px 12px;
color: #4caf50;
outline: none;
}
.btn:active {
background: #eee;
}
</style>
<button class="btn">
按钮
</button>
<p></p>
<script>
var btn = document.querySelector('.btn');
var p = document.querySelector('p');
var total = ;
btn.addEventListener('click', function() {
btn.innerText = ++total;
});
btn.addEventListener('click', function() {
p.innerText = total;
});
</script>
<style>
.btn {
border: px solid #4caf50;
font-size: px;
padding: px px;
color: #4caf50;
outline: none;
}
.btn:active {
background: #eee;
}
</style>
<button class="btn">
按钮
</button>
<script>
var btn = document.querySelector('.btn');
var total = ;
function fn() {
btn.innerText = ++total;
if (total > ) {
btn.removeEventListener('click', fn);
}
}
btn.addEventListener('click', fn);
</script>
602392714
清零编程群