jQuery笔记二--选择器与方法

jQuery项目:

1、项目需求

2.建立结构和样式,脚本

$("p").click(function(){});

 

创建存储空间:var discount = 250;

$(this)返回当前元素;

append方法将指定的内容插入到DOM,内容将增加到调用这个方法的元素的最后。

remove()移除元素

后代选择器: $("div p")

 

<!DOCTYPE html>
<html>
<head>
<title>Jump for Joy</title>
<link href="styles/my_style.css" rel="stylesheet">
</head>
<body>
<div id="header">
<h2>Jump for Joy Sale</h2>
</div>
<div id="main">
<div class="guess_box"><img src="images/jump1.jpg"/></div>
<div class="guess_box"><img src="images/jump2.jpg"/></div>
<div class="guess_box"><img src="images/jump3.jpg"/></div>
<div class="guess_box"><img src="images/jump4.jpg"/></div>
</div>
<script src="scripts/jquery-1.6.2.min.js"></script>
<script>
$(document).ready(function() {
$(".guess_box").click(function() {
$(".guess_box p").remove();
var discount = Math.floor((Math.random()*5) +5);
var discount_msg = "<p>You discount is " + discount + "%</p>";
alert(discount_msg);

$(this).append(discount_msg);
}); // end click function
}); //end doc ready
</script>
</body>
</html>

posted @ 2015-12-21 16:03  sky.zhao  阅读(166)  评论(0编辑  收藏  举报