JavaScriptはスクウェア効果を実現します。
ワイパーはどうしますか?
本論文の実例はJavaScriptがスクレーパーの効果を実現する具体的なコードを共有しています。
ここに来たら教えます
1、まずプログラミングソフトを準備します。web Stormやeclipseもいいです。
2、コードの作成ができませんか?用意しておきます
3、以下の通りです
5、最終ページ表示画面は以下の通りです。
以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。
本論文の実例はJavaScriptがスクレーパーの効果を実現する具体的なコードを共有しています。
ここに来たら教えます
1、まずプログラミングソフトを準備します。web Stormやeclipseもいいです。
2、コードの作成ができませんか?用意しておきます
3、以下の通りです
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.outer{
height: 90px;
width: 300px;
margin: 0 auto;
margin-top: 5px;
}
.box{
height: 70px;
width: 70px;
background-color: darkgray;
line-height: 70px;
text-align: center;
display: inline-block;
margin-left: 5px;
}
</style>
</head>
<body>
<div class="outer">
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>
<div class="outer">
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>
<div class="outer">
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>
<script>
var boxs = document.getElementsByClassName("box");
var item = [" "," "," "," "," "," "," "," "," ",];
for (var i = 0;i<boxs.length;i++){
var box = boxs[i];
box.onclick = function (){
this.style.backgroundColor="red";
//this.innerText=" ";// , !
var number = Math.floor(Math.random()*9);
this.innerText = item[number];
this.style.color = "#fff";
this.style.verticalAlign = "top";
}
}
</script>
</body>
</html>
4、この部分のコードブロックの文字の内容はカスタマイズできます。表示したい内容に書き換えられます。5、最終ページ表示画面は以下の通りです。
以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。