`
xiuying
  • 浏览: 537419 次
  • 性别: Icon_minigender_1
  • 来自: 福建
社区版块
存档分类
最新评论

JQuery in action 学习笔记

    博客分类:
  • JS
阅读更多
Jquery 方法

1、初始化加载 方法
$(document).ready(function(){
      //执行代码
  });
==
$().ready(function(){
      //执行代码
  });

==
$(function(){
      //执行代码
  });

2、根据id获取对象
$('#IdName');

3、根据标签名称获取对象 注意:没有引号 没有#号
$(objName);

4、给某对象添加样式类
$('#objName').addClass('className');

5、删除某对象样式类
$('#objName').removeClass('className');

6、绑定事件 bind()
$('#objName').bind('事件名称(如:click)', function(){执行操作});

7、简写事件
$('#objName').click(function(){执行操作});

8、toggle()两个方法之间转换调用, 同名效果(effect)
$('#objName').toggle(function(){执行方法一},function(){执行方法二});
例如:隐藏、显示
$('#objName').toggle(function(){$('#obj').hide();},function(){$('#obj').show();});

9、鼠标指针进入元素和离开元素时的操作 .hover();
$('#objName').toggle(function(){alert('鼠标进入');},function(){alert('鼠标离开');});

10、修改内联css
.css('property','value');
.css({property1:'value1', property2:'value2'});
获得对象样式里的某一项
$('#objName').css('fontSize');

11、基本的现实和隐藏  .show();   .hide();
$(objName).show();
$(objName).hide();
这两个方法都有三个参数 slow(0.6秒) normal(0.4秒) fast(0.2秒)
$(objName).show('slow');
还可以直接写数值,以毫秒为计算单位。注意:直接写数值不需要加引号
$(objName).show(1000);

12、淡入、淡出 fadeIn(); 也具有show(); 的三个参数值
$(objName).fadeIn();

13、多重效果
fadeIn(); 和 fadeOut(); 不透明度
fadeTo(); 不透明度
slideDown(); 和 slideUp();  高度

14、自定义动画效果 animate();
参数:1、样式属性及值的映射   及.css();
      2、可选速度参数
      3、可选缓动(easing)参数
      4、可选回调函数
例如:$(objName).animate({parame1:'value1', parame2:'value2'},speed, function(){alert();});

15、.attr()替换某一对象的属性
$(objName).attr({'id':'idValue', 'title':'titleValue'});

16、.each()方法类似for循环
例如遍历div下的某一类的所有连接
$('div.className a').each(function(index){index+1;执行操作});

17、 .insertAfter()  .after  .insertBefore()  .before() 顾名思义向什么地方插入对象
$(document).ready(function(){
$('expression').insertAfter(objName);
})
如:向div对象后插入返回top的连接
$(document).ready(function(){
$('<a href="#top">back to top</a>').insertAfter('div.className objName');
$('<a id="top" name="top"></a>').prependTo('body'); //向body加入这个锚点
})
注:如果用alert() 则表达式 和对象名调换位置。

18、克隆对象.clone();包括内容,如果.clone(false);值复制标签
$(objName).clone();

19、在对象外部插入新元素用.warp();
$(objName).warp("content");

20、向某一对象里载入其他页面内容 .load();
$('#objId').load(x.html);

21、清空对象 .empty();
$(objName).empty();
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics