zoukankan      html  css  js  c++  java
  • jQuery基础

    jQuery是什么?

    jQuery是一个优秀的JS框架,他能够是用户更方便的处理HTML文档、动画效果和Ajax交互等。他的出现极大程度的改变可开发者使用js的习惯,掀起了一场新的网页革命。

    jQuery的主要功能?

    1)访问页面框架的局部。

    2)修改页面的表现。

    3)更改页面的内容。

    4)响应事件。

    5)为页面添加动画。

    6)与服务器异步交互。

    7)简化常用的技术操作。

    下载jQuery  http://jQuery.com/提供最新的jQery框架下载。

    通用语法:   $(selector)或jQuery(selector)其中selector符合CSS3标准;

    选择元素:

     id选择器: $("#showDiv")相当于js中的document.getElementById("#showDiv"),可以看到jQery简洁很多;

    类别选择器:$(".SomeClass") 选择css类别为someclass的所有节点元素,在js中实现相同的选择,需要用for循环遍历整个DOM;

    $("P:odd") 选择所有奇数行的<P>标记。几乎所有的标记都可以使用“:odd”或者":even"来实现奇偶的选择;

    $("td:nth-child(1)")所有表格行的第一个单元格,就是第一行。

    $("li>a")子选择器,返回<li>标记的所有子元素<a>,不包括孙标记

    $("a[href$=pdf]")选择所有的超链接,并且这些超链接的href属性是以'pdf'结尾的。

    创建DOM元素

    <script language = "javascript">

    $(function(){             //ready()函数

      var newP = $("<p>hello</p>")   //创建DOM元素

      newP.insertAfater("#myTarget")    //insertAfter()方法

    })

    </script>

    .....

    <p id = "myTarget">插入到这行数字之后</p>

    <p>也就是插入到这行文字之前,但是这行没有id,也可能不存在</p>

    使用选择器

    1、使用选择器

    $("a[title]") 选择设置了title属性的标记$("a[title]").addClass("myClass")增加myClass样式风格

    $("a[href=10-9.html]").addClass("myClass")href的属性值等于"10-9.html"的超链接添加myClass样式风格

    $("a[href^=http://]").addClass("myClass")href的属性值以http://开头超链接添加myClass样式风格

     $("a[href$=html]").addClass("myClass")href的属性值以html结尾超链接添加myClass样式风格

    2、包含选择器

    $(li:has(a))包含了所有超链接的所有<li>标记

    $("ul li ul li:has(a)").addClass("myClass")选中的二级项目列表所有包含了超链接的<li>标记

    3、位置选择器

    $("p:first-child")选择第一个<p>标记通过:first-child来选择

    $("p:nth-child(odd|even)").addClass("myClass")选择奇偶行进行添加myClss样式

    $("p:eq(4)").addClass("myClass")选择说有<p>列表中的第五个

    4、过滤选择器

    5、反向过滤

    $(":input:not(:checkbox):not(:radio)").addClass("myClass")表示所有<input>、<select>、<textarea>或<button>中而非checkbox和非radio的元素,这里注意input与:input的区别

    管理选择结果

    1、获取元素的个数

    $("img").size()

    2、提取元素

    $("img[title]")[1] 等同于 $("img[title]").get[1]

    3、添加、删除、过滤元素

    添加:$("img[alt]").add("img[title]") 等同于 $("img[alt],img[title]")

    删除:$("li[title]".not("[title*=issac]"))表示选中所有设置了title属性的<li>标记,但不包括title值中任何匹配字符串"issac"的那些

    过滤:$("li").filter("[title*=isaac]")表示在<li>标记的列表中删选出的那些属性title值任何字符串"isaac"的标记

    4、查询过滤新元素集合

    $("p").find("span")搜索<span>标记,获取一个新的元素集合,他完全等同于$("span",$("p"))

    先写到这,本文章全是列出Jqery一部分属性,具体的各种属性,我们可在网上搜到,在这就不陈述!

  • 相关阅读:
    ContentProvider与ContentResolver使用
    ASP.NET Web API 控制器创建过程(二)
    Yii PHP Framework有用新手教程
    图像切割之(五)活动轮廓模型之Snake模型简单介绍
    使用CXF+spring创建一个web的接口项目
    使用spring @Scheduled注解运行定时任务、
    Oracle11g新特性之动态变量窥视
    yum命令常见方法
    Linux负载均衡软件LVS之一(概念篇)
    Linux查看CPU和内存使用情况
  • 原文地址:https://www.cnblogs.com/gaoshuai/p/1765829.html
Copyright © 2011-2022 走看看