JQuery学习笔记(一)环境搭建

一、下载jQuery Starterkit(从官网,或者csdn下载)

打开starterkit.html和custom.js这两个文件
starterkit.html中导入了这两个js,选择自己的是Jquery1.2.6还是1.3.2或者更新
<script src="jquery.js" type="text/javascript"></script>
<script src="custom.js" type="text/javascript"></script>
在custom.js中写自己的代码,For Example
jQuery(document).ready(function()
{
// do something here
$("a").click(function()
{
alert("hello world");
});

});
二、根据API的方法写自己的逻辑
将starterkit中的一个CSS样式red附加到了orderedlist上
$(document).ready(
function()
{
$("#orderedlist").addClass("red");

});
将所有orderedlist中的li都附加了样式"blue"
$(document).ready(
function()
{
$("#orderedlist > li").addClass("blue");
});
当把鼠标放在li对象上面和移开时进行样式切换,但只在list的最后一个element上生效
$(document).ready(
function()
{
$("#orderedlist li:last").hover(
function()
{
$(this).addClass("green");
},
function()
{
$(this).removeClass("green");
});
});

Find me:使用选择器和事件,对Element进行迭代
$(document).ready(
function()
{
$("#orderedlist2").find("li").each(
function(i)
{
$(this).html($(this).html()+"hello"+i);
});
});

点击Reset链接后,就选择了文档中所有的form元素,并对它们都执行了一次reset()。
$(document).ready(
function()
{
$("#reset").click(function()
{
$("form").each(function()
{
this.reset();
});
});
});

filter()以过滤表达式来减少不符合的被选择项, not()则用来取消所有符合过滤表达式的被选择项
$(document).ready(
function()
{
$("li").not("[ul]").css("border","1px solid black");
});
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值