`
顽石OK07
  • 浏览: 80981 次
  • 性别: Icon_minigender_2
  • 来自: 上海
社区版块
存档分类
最新评论

Jquery基础知识复习(转)

阅读更多

jQuery 
   1.特点: 
   小巧 
   功能强 
   跨浏览器 
   插件 

   2.使用 
    实际是js文件 
    a)  复制js到WebRoot 
    b)  页面<script src="jquery.js" charset=""></script> 

   3.核心对象及常用方法和属性 
     a)名称 
     jQuery和$ 
     用$找出来的对象叫jQuery对象 
     用document找出来的对象叫Dom对象 
     
     b)dom和jquery对象转换 
     jQuery对象.get(0) --->dom对象 
     $(dom对象)--->jQuery对象 
    
     c)jQuery对象方法 
      .show() 显示 
      .hide() 隐藏 
      .toggle() 显示或隐藏切换 
      $("div").hide(); 
      $("#myid").show(); 
      $(".myclass").show(100); 

      .size() 找到多少个对象 
      var n = $("div").size() 

      文本框赋值(value) 
      $("#myid").val(123); 
      .val()取值 

      层的内容.innerHTML/.innerText 
      $("div").html() ; 
      $("div").html(123); 
      $("div").html("<input type=button>"); 
      $("div").text("<input type=button>"); 

      样式 document....style.color="red" 
      $("div").css("color","red").css("font-size","18"); 
      $("div").css({color:"red","font-size":18}); 

      删除 
      $("div").remove(); 删除所有div 

      添加 
      父加子: $("div").append("<input button>"); 
              $("div").append( $("#myid") ); 
      子加父 
           $("input").appendTo(  $("div") ); 

      对象属性 
        $("input").attr("checked",true); 

      去首尾空格: 
         $.trim(字符串) 
$("div").each(  function(i,obj){}  ); 
$.post(url,function(x){}); 
$.post(url,{键:值},function(x){}); 
$.getJSON(url,function(x){//这里x已转成json了,不要用eval}); 

      克隆 
        $("div").clone(); 

4. 选择器 
    a) 类选择器 
       <input type=text class="myclass"> 
       $(".myclass")     找多个 
    b) id选择器   
       <input type=text id="myid"> 
       $("#myid") 找一个 
       相当于:document.getElementById("myid") 
    c) 标记选择器   找多个 
       $("div,span") 
       相当于document.getElementsByTagName() 
    d) 表单选择器 
       $(":text")   所有文本框 
       $("input[type=text][value='']") 

       $(":radio")  所有单选框 
       $(":checkbox") 所有复选框 
    e) 表单属性选择器 
       $(":checkbox:checked")或$(":checked:checkbox") 
       $(":checked")  找所有选中(单选框和复选框) 
       $(":selected") 找所有选中列表框 
    f) 层级选择器 
       父找子 d找c 
       $("table").find("tr")  //找子孙都可以 
       $("table>tbody>tr") 找所有tr 
       $("table>tbody>tr:first") 找第一行 
       $("table>tbody>tr").eq(0) 找第一行 
       $("table>tbody>tr:odd")   所有奇数行 
       $("table>tbody>tr:even")  所有偶数行 

       子找父 
       $("tr").parent() 

       找兄弟 
       $(a).next() 下一个 
       $(b).prev() 上一个 


---jQuery对表格tr的操作 
function bh()  //序号进行编号 
      { 
        jQuery("#t>tr").each(function(i,obj){ 
           obj.cells[0].innerHTML=i+1; 
        }); 
      } 
      function addRow() //添加一行tr 
      { 
       var tr = jQuery("#t>tr:first").clone().appendTo(jQuery("#t")); 
          tr.find(":text").val(""); 
          tr.find("td").eq(4).html("");  //eq(4)第二个文本框 

          bh(); 
      } 
          function droRow(del) //删除一行tr 
      { 
         jQuery(del).parent().parent().remove(); 
         bh(); 
      } 
      
      //计算输入文本中数字的结果  
      function js(js) 
      { 
         //找到tr 
         var tr=jQuery(js).parent().parent(); 
         //取数 
         var sl=tr.find(":text").eq(1).val(); 
         var jg=tr.find(":text").eq(2).val();  
         tr.find("td").eq(4).html(sl*jg); 
         
      } 

分享到:
评论

相关推荐

    JQuery01.doc

    Jquery技术的基础详细学习笔记,总结了Jquery技术的各个知识点,可以用来复习以及对基础知识的巩固,对新人的学习很有帮助。

    JQuery02.doc

    Jquery技术的基础详细学习笔记,总结了Jquery技术的各个知识点,可以用来复习以及对基础知识的巩固,对新人的学习很有帮助。

    jquery-cheat-sheet:我参加了jQuery速成班,并决定为需要的人做一个备忘单。 随意下载文件,并在使用jQuery时用作参考

    在尝试开始学习jQuery之前,请让自己学习JavaScript的基础:基础知识,DOM操作,事件,AJAX和异步JavaScript。 如果您还没有学习JavaScript的基础知识,那么我就制作了有关可以从中学习大部分内容的。什么是jQuery...

    最新Python3.5零基础+高级+完整项目(28周全)培训视频学习资料

    最新Python3.5零基础+高级+完整项目(28周全)培训视频学习资料;本资料仅用于学习。 【课程内容】 第1周 开课介绍 python发展介绍 第一个python程序 变量 字符编码与二进制 字符编码的区别与介绍 用户交互程序 if ...

    前端:品优购的相关页面制作

    内容概要:通过HTML、CSS以及JS相关知识完成品优购相关页面:...阅读建议:此资源通过四个页面的制作,将HTML、CSS以及JS的相关知识融入其中,我们在查看源代码时,可以将相关参数进行调整,从而对相关知识进行复习。

    python入门到高级全栈工程师培训 第3期 附课件代码

    04 Python 基础知识练习题试题 第12章 01 今日内容介绍以及基础测试题答案讲解 02 Python 列表的魔法 03 Python 元组的魔法 04 Python 字典的魔法 05 Python 错误更正:布尔值可以作为字典的key 06 Python 今日...

    JavaWeb每日总结思维导图

    JavaWeb每日总结思维导图,包含JavaWeb开发的多项技术,方便复习知识点使用。内容包括:MySQL、MySQL约束&多表、MySQL多表&事务、JDBC、数据库连接池、HTML、CSS、JS基础&高级、BootStrap、XML、Tomcat、Servlet&...

    程序员专用刷题-silabus:计算机图形学大纲(IF184502)A级,ITS信息学,2018年

    程序员专用刷题 布局 永久链接 ...基础知识 基本的 jQuery 知识(DOM 交互,如添加/删除元素/类等) 这些不会由讲师强制执行,但是如果您不了解这些概念,您就会迷失方向。 如果您需要复习,请查看 . 课程

    程序员专用刷题-syllabus:纽约大学高级JavaScript课程的教学大纲

    基础知识 基本的 jQuery 知识(DOM 交互,如添加/删除元素/类等) 这些不会由讲师强制执行,但是如果您不了解这些概念,您就会迷失方向。 如果您需要复习,请查看 . 课程大纲 我们将深入研究 JavaS

    程序员专用刷题-syllabus:教学大纲

    基础知识 基本的 jQuery 知识(DOM 交互,如添加/删除元素/类等) 这些不会由讲师强制执行,但是如果您不了解这些概念,您就会迷失方向。 如果您需要复习,请查看 . 课程大纲 我们将深入研究 JavaS

    程序员专用刷题-2019.1:2019.1

    基础知识 基本的 jQuery 知识(DOM 交互,如添加/删除元素/类等) 这些不会由讲师强制执行,但是如果您不了解这些概念,您就会迷失方向。 如果您需要复习,请查看 . 课程大纲 我们将深入研究 JavaScript 的细微差别...

    微博的搜索引擎优化价值分析等资料.rar

    2012-05-27 11:08 180,401 Java基础复习笔记05数据结构-栈.pdf 2012-05-27 11:05 834,613 jqueryui-API(最完整).pdf 2012-05-27 10:58 31,758,963 Linux程序设计(原书第2版).pdf 2012-05-27 11:03 2,023,736 ...

    资料合集.part2.rar

    2012-05-27 11:08 180,401 Java基础复习笔记05数据结构-栈.pdf 2012-05-27 11:05 834,613 jqueryui-API(最完整).pdf 2012-05-27 10:58 31,758,963 Linux程序设计(原书第2版).pdf 2012-05-27 11:03 2,023,736 ...

    资料合集.part1.rar

    2012-05-27 11:08 180,401 Java基础复习笔记05数据结构-栈.pdf 2012-05-27 11:05 834,613 jqueryui-API(最完整).pdf 2012-05-27 10:58 31,758,963 Linux程序设计(原书第2版).pdf 2012-05-27 11:03 2,023,736 ...

Global site tag (gtag.js) - Google Analytics