美文网首页
jQuery基础

jQuery基础

作者: 当如初见_163a | 来源:发表于2017-05-20 08:55 被阅读0次
    一.jQuery基本功能

    1.访问和操作DOM元素:<code>$(".oDiv"").val();</code>

    2.控制页面样式.<code>$(".oDiv").click(function{$(this).toggleClass(".oDiv1")});</code>

    3.对页面事件的处理.

    4.大量插件在页面的运用.

    5.与Ajax技术的完美结合.

    二.搭建开发环境

    1.下载文件库:<code>http://jquery.com</code>

    2.引入jQuery文件库:

    <script language="javascript" type="text/javascript" src=""></script>
    
    三.第一个程序

    1.第一个程序:<code>$(document).ready(function(){ $("div").html("你好!欢迎来到jQuery的精彩世界!")});</code>

    四.代码风格

    1.<code>$</code>美元符号的使用:无论是页面元素的选择,功能函数的前缀都须使用该符号.

    2.事件操作链接式书写:使用链接式的方式编写该元素的所有事件.

    $(".title").click(function(){
    $(this).addclass("curcol")
    .next(".content").css("dsplay","block");
    });

    五.jQuery选择器

    1.使用简单:<code>$("#tbStu tr:nth-child(even)").addClass("trOdd");</code>

    2.完美的检测机制:<code>不需要检测找元素,不存在也不会报错卡死</code>

    3.有4大类型:

    基本选择器:<code>#id</code>,<code>element</code>元素,<code>.class</code>,<code>*</code>所有,<code>selector1 selectorN</code>多项选择

    层次选择器:<code>ancestor descendant</code>后代,<code>parent>child</code>父子,<code>prev+next</code>prev后相邻,<code>prev~siblings</code>prev后所有兄弟,相当于<code>nextAll()</code>

    过滤选择器:

    简单: first()或:first第一个,last()或:last最后一个,:no(selector)除选择外,:even偶数,:odd奇数,:eq(index)指定索引,:gt(index)大于索引,:lt(index)小于索引,:header标题类h1 h2..,:animated正在执行动画
    内容::contains(text)给定文本,:empty无子或空,:has(selector)内含有,:parent有子或文本.
    可见性: :hidden不可见或hidden, :visible可见.
    属性:[attribute]属性,[attribute=value]特定属性值,[attribute!=value]无特定属性值,[attribute^=value]某值开始,[attribute$=value] 某值结束,[attribute*=value]包含某值,[selector1][selector2][selectorN]多属性
    子元素: :nth-child(eq|even|odd|index)特定位置,:first-child第一个,:last-child最后一个,:only-child只有一个的
    表单对象属性: :enabled属性可用,:disabled属性不可用,:checked被选中,:selected选中的option

    表单选择器: :input所有input textarea select,:text单行文本,:password密码框,:radio单选,:checkbox复选,:submit:提交,:image图像域,:reset重置,:button按钮,:file文件域<br>

    相关文章

      网友评论

          本文标题:jQuery基础

          本文链接:https://www.haomeiwen.com/subject/zhguxxtx.html