1. JQuery初体验--helloWorld

最新推荐文章于 2024-04-02 20:41:11 发布

最新推荐文章于 2024-04-02 20:41:11 发布 · 171 阅读

文章标签：

#jquery #ViewUI

JQuery 专栏收录该内容

1 篇文章

订阅专栏

初学 JQuery，经典的hello world!

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>初学JQuery</title>

<script language="javascript" src="jquery-1.8.2.js" type="text/javascript"></script>
</head>

<body>
<div>一、引入"jquery-1.8.2.js"文件，进入JQuery的初体验吧！如下：<br/>
<input id="helloWorld1" type="button" value="点击我呀,隐藏"/>
<input id="helloWorld2" type="button" value="点击我呀,显示"/>
<input id="helloWorld3" type="button" value="点击我呀,显示或隐藏"/>
<p style="background-color:#CCC">点击按钮显示或隐藏此。 hello world!</p>
</div>

</body>

<script language="javascript">
$(document).ready(function(){//它的缩写方法：$(function(){ //do something });
$("#helloWorld1").click(function(){
$("p").hide();
});

$("#helloWorld2").click(function(){
$("p").show();
});

$("#helloWorld3").click(function(){
$("p").toggle();
});

});

</script>
</html>