1. 程式人生 > >利用js指令碼實現自動載入

利用js指令碼實現自動載入

主要功能是讓js自動載入,把指令碼拖到頁面中,讓它自己載入就行了。

網頁程式碼:

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title>搶月餅活動</title>
 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
 
</head>

<body>
       <h1>搶月餅活動</h1>
       <div class="button">
            <button id="rush">點我搶購</button>
       </div>
</body>

<script type="text/javascript">
         $(function(){
              $("#rush").click(function(){
                    console.info("搶購成功!");
              });
         })
</script>
</html>

js指令碼:
       setInterval(function(){
                $("#rush").trigger('click')
       },1000)

網頁顯示效果(按F出現下面除錯視窗):

按牛客網的說法是給chrome瀏覽器加個擴充套件程式,但是chrome現在好像禁止了,有評論說火狐上可以,我沒試,大家有興趣的可以試試。

看最下面的Console視窗,因為搶購成功是顯示在這裡的,不過首先要把js指令碼放到Console裡,

然後按回車鍵,會出現:

搶購成功前面的數字會自動遞增

ok!

ps:

也可以把js指令碼直接放在網頁中,

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>搶月餅活動</title>
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
	<script type="text/javascript">
		setInterval(function(){
			$("#rush").trigger('click')
		},1000)
	</script>
</head>

<body>
	<h1>搶月餅活動</h1>
	<div class="button">
		<button id="rush">點我搶購</button>
	</div>
</body>

<script type="text/javascript">
	$(function(){
		$("#rush").click(function(){
			console.info("搶購成功!");
		});
	})
</script>
</html>