您的位置:首页 > Web前端 > JQuery

JQuery的链式编程与隐式迭代

2014-06-28 10:53 246 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title></title>

<script src="js/jquery-1.7.1.js" type="text/javascript"></script>

<script type="text/javascript">

$(function () {

$('input').click(function () {

// $('p').text('你们都是P');//通过JQuery的选择器选择出来的DOM元素存入JQuery的DOM数组中,返回的是一个数组集合

//JQuery的隐式迭代就是JQuery方法遍历内部DOM数组的过程。不用再像JS中循环遍历

$('p').text('你们都是小青蛙').css({ "background-color": "red", "border": "10px double yellow" }).click(function () {

alert('呱呱呱呱呱呱');

alert($(this).text());

}); //链式编程,每个方法返回的都是调用者自己,JQuery中几乎都是方法,属性很少,方便实现链式编程

//每个JQuery对象的方法都是从 Jquery函数的 prototype属性中共享。

});

});

</script>

</head>

<body>

<p>

aaaaaaaaaaaaaaaaaaaaaa

</p>

<p>

aaaaaaaaaaaaaaaaaaaaaa

</p>

<p>

aaaaaaaaaaaaaaaaaaaaaa

</p>

<p>

aaaaaaaaaaaaaaaaaaaaaa

</p>

<p>

aaaaaaaaaaaaaaaaaaaaaa

</p>

<p>

aaaaaaaaaaaaaaaaaaaaaa

</p>

<p>

aaaaaaaaaaaaaaaaaaaaaa

</p>

<input type="button" name="name" value="按钮" />

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: