初识jQuery

简介:jQuery是对JavaScript对象和函数的封装,如同后台方法一样,有各种方法会使用就行,提高工作效率不要写大量的JS原生代码,想详细了解jQuery各个执行过程去学JS去。

jQuery的引入:<script src="路径" type="text/javascript"></script>

一、基本语法  
1.$(document).ready(function(){}) 当页面加载完成后执行的方法
   $(document).ready()与window.onload类似,但仍有区别

1.语法结构:$(selector).action(); 
    $():工厂函数,将DOM化为jQuery对象
    selector:选择器:例如 “#id” 等对节点元素进行选择
    action:方法,jQuery中提供的各种方法,例如 $("#id").onclick();
注意:在jQuery中 $==jQuery 即 $(document).ready()== jQuery(document).ready() 
注意:jQuery与js不要混用,例如:
var a=document.getElementByID("ss"); a.addClass();
 注意只有在jQuery中才有第二种写法,但是a并不是jQuery所封装好的对象类型,因此不能用。换个思路用jQuery的方式来获取对象就可以:
var a=$("#ss"); a.addClass();  这样就没问题。

二、 操作页面元素
1.jQuery.对象.addClass(class名称);
    例: $("#id").addClass("aa"); 常用于修改样式
2.jQuery.对象.css("属性","属性值");设置单个CSS
    ~~.css({"属性1","属性值1","属性2","属性值2"});设置多个CSS
3.~~.show();显示元素 
   ~~.hide();隐藏元素
4.链式操作:对一个对象进行多重操作,并将操作结果返回给该对象
例如:1.$("h2").css("backgroundcolor","#ccffff").next().css("display","block");
意思是:给h2元素添加背景色css之后再使其显示。
        2.$("#Test").addClass('style').find("div").eq(0).fadeOut(200);
意为:先为id为Test的对象添加"style"这个样式,再找寻其下的第一个div标签,并使其淡出
        3.$(".ss").css("width","100px").click(function(){}).alt("");
意为:将class为ss的元素的宽度设为100px,点击时间为。。,alt为~~。   

注意:在jQuery中点击时间为click,并且不可以直接写 ~~.click(bb());可以换个思路 $(".ss").click(function(){bb()});
          

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 通过jQuery,您可以选取(查询,query)HTML元素,并对它们执行“操作”(actions)。 jQuer...
    枇杷树8824阅读 671评论 0 3
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,202评论 0 1
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,379评论 0 2
  • //------------------------- 第一章 认识JQuery ----------------...
    米塔塔阅读 748评论 0 9
  • 1.JQuery能做什么? 选择网页元素改变结果集元素的操作工具方法事件操作特殊效果AJAX 2.JQuery对象...
    BAWScipes阅读 282评论 0 0