jquery整理

$.extend扩展
Jquery的bin绑定事件,unbind取消所有事件
Jquery学习地址:http://www.runoob.com/jquery/jquery-plugin-validate.html
Jquery学习地址:http://www.haorooms.com/post/jquery_selecter_zj
使用ajax的jsonP跨域请求数据,需要在服务器对数据进行处理
    ajax跨域请求会传过来一个参数如callback
    判断这个参数是否为空
    不为空时取出值,使用request.getWriter().println(callback+”(”json对象+”)”)
Window.loaction.href=””跳转
框架不能按照意愿修改
框架前段离不开Ajax,后端离不开servlet
.toFixed(2)保留两位小数
.prop("checked",true/false)设置是否被选中
.prop("checked")判断是否被选中
.parseDouble("String")转换为小数
.find("td")找到子类名称标签
each(cks,function(i,obj){})obj为DOM文档对象
原始的javascript取值:
getElementById(id)  document  dom1&2
getElementsByClassName(name)  document  dom3
getElementsBy Name(name)  document  dom1&2
getElemenstByTag Name(name)  document  dom1&2
getElementsByTag NameNS(name)  document  dom1&2
dom1&2支持IE8以下及以上版本
dom3支持IE9以上版本(html5最新标签)
原始的javascript对表格、或者其它节点操作非常复杂的,考虑兼容性的问题,
各版本语法不一致
onClick:IE8及以下没有问题的,火狐用 click
jquery 最核心的、最强大的 是它的选择器
页面加载完成后:
    $(document).ready(function(){
});
$(funcution(){
});
JavaScript与jquery初始化区别:
    Window.onload=function(){
        alert(‘a’);
};
Window.onload=function(){
        alert(‘b’);
};
只输出b,后面的onload事件覆盖前面的onload事件
执行时机:必须等待网页中的内容执行完成后才能执行(包括图片)
$(document).ready(function(){
    alert(‘a’);
});
$(funcution(){
    alert(‘b’);
});
依次输出a、b累加操作
执行时机:网页中所有的DOM结构绘制完成后就执行,可能元素关联的内容并没有加载完

将值转换为number类型:
        parseInt(this.value);
查找父级或兄弟级节点:
jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class")
jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素
jQuery.children(expr).返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点
jQuery.contents(),返回下面的所有内容,包括节点和文本。这个方法和children()的区别就在于,包括空白文本,也会被作为一个
jQuery对象返回,children()则只会返回节点
jQuery.prev(),返回上一个兄弟节点,不是所有的兄弟节点
jQuery.prevAll(),返回所有之前的兄弟节点
jQuery.next(),返回下一个兄弟节点,不是所有的兄弟节点
jQuery.nextAll(),返回所有之后的兄弟节点
jQuery.siblings(),返回兄弟姐妹节点,不分前后
jQuery.find(expr),跟jQuery.filter(expr)完全不一样。jQuery.filter()是从初始的jQuery对象集合中筛选出一部分,而jQuery.find()的返回结果,不会有初始集合中的内容,比如$("p"),find("span"),是从元素开始找,等同于$("p span")
根据class取得多个对象,并取得他们的值:
    $(‘.mycount‘).each(function(){ arr.push(parseInt($(this).val())); });
标签显示内容设值:
    .text(vale);
    .html(value);
表单value设值:
    .val(value);
移除一行数据:
    $(this).parents(‘tr‘).remove();
复选框是否被选中
    .is(‘:checked‘)
复选框设值,是否被选中
    .attr(‘checked‘,’true’);
    .removeAttr("checked");复选框已选中个数:  $(".ck:checked").length;遍历选中复选框:  $(".ck:[checked]").each(function(){});  $(".ck:checked").each(function(){});
循环遍历
$.each(数组,事件(下标,对象));
$.each(对象,事件(键,值));
$.each(数组对象,事件(下标,对象));
DOM节点操作:
在选择器的里面的最后面添加 标签内容
 选择器.append(“标签内容”);
  <p>Hello</p>
 $(“p”).append(“<h1>你好</h1>”);
 结果:  <p>Hello <h1>你好</h1> </p>
在选择器的里面的最前面添加 标签内容
选择器.prepend(“内容”)
<p>Hello</p>
 $(“p”).prepend(“<h1>你好</h1>”);
 结果:  <p><h1>你好</h1>Hello  </p>
把选择器元素全部删除
 选择器.remove();
 <p>Hello, <span>Person</span> <a href="#">and person</a></p>
 $(“p”).remove();
把选择器元素里面的内容删除
选择器.empty();
<p>Hello, <span>Person</span> <a href="#">and person</a></p>
 $(“p”).empty();  -->  <p></p>
复选框:
取得值
    $("input[type=‘checkbox‘]").prop("checked");
设定值
   $("input[type=‘checkbox‘]").prop("checked",true/false);
Jquery 使用ajax最完整写法
   $.ajax({
       type:”get/post”,
       url:”请求地址”,
       data:{“userName”: “wy” ,  “password”:”111”}  //post用的
       async:true/false,      是否异步
       cache:true/false,      是否缓存页面,false url?r=Math.random()
       dataType:”text/html/script/xml/json/jsonp”,  返回类型
       success:function( 变量名 ){
              解析
       },error:function(e){
            //出错操作
       }
   });

Jquery 使用ajax简洁写法,方便更多人用,精简
  $.get(url ,{参数名:值 ,参数名:值 },function(变量名){
          解析
 });

  $.post(url ,{参数名:值 ,参数名:值 },function(变量名){
          解析
 });
JSON(JavaScript Object Notation)和JSONP(JSON with Padding)区别:
JSON是一种数据交换格式,
JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议
时间: 2024-10-16 23:58:56

jquery整理的相关文章

jQuery整理笔记七----几个经典表单应用

1.文本框获得(失去)焦点 当文本框获得输入焦点时,将该文本框高亮显示,算不得一个应用,仅仅是一个小技巧,能够提高用户体验. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/

jQuery整理笔记八----jQuery的Ajax

Ajax,我一直读的是"阿贾克斯",据当时大学老师讲该读音出处是根据当年风靡欧洲的荷兰足球俱乐部阿贾克斯的名字来的,我觉得说法挺靠谱的. jQuery封装了Ajax的交互过程,用户不需要考虑XMLHttpRequest对象的兼容性问题以及使用XMLHttpRequest建立连接.发送请求.发送方式.接收方式等细节,利用jQuery定义 的几个简单方法,即可轻松实现客户端与服务端异步通信的问题,从而帮助开发人员从繁琐的技术细节中解脱出来,专心于业务层开发工作. 最初始的JavaScrip

jQuery整理笔记目录

jQuery整理笔记目录 jQuery整理笔记一----jQuery开始 jQuery整理笔记二----jQuery选择器整理 jQuery整理笔记三----jQuery过滤函数 jQuery整理笔记四----jQuery操作DOM jQuery整理笔记五----jQuery事件 jQuery整理笔记六----jQuery动画 jQuery整理笔记七----几个经典表单应用 jQuery整理笔记八----jQuery的Ajax jQuery整理笔记九----功能性表格开发 jQuery整理笔记目

jQuery整理笔记九----功能性表格开发

示例中用到的一些图片.插件.样式文件等下载地址:点我进入下载 过去在开发过程中关于table方面的jquery应用仅仅是局限于使用jquery操作table增加一行.删除一列等等操作.今天整理的跟过去用的不一样. 1.uiTableFilter uiTableFilter是一款表格数据行过滤插件,使用很简单,具体用法如下: $.uiTableFilter(table,phrase)  该函数包含两个参数,其中第一个参数为jQuery对象,即为jQuery方法匹配的表格,或者也可以是jQuery匹

jQuery整理笔记文件夹

jQuery整理笔记文件夹 jQuery整理笔记一----jQuery開始 jQuery整理笔记二----jQuery选择器整理 jQuery整理笔记三----jQuery过滤函数 jQuery整理笔记四----jQuery操作DOM jQuery整理笔记五----jQuery事件 jQuery整理笔记六----jQuery动画 jQuery整理笔记七----几个经典表单应用 jQuery整理笔记八----jQuery的Ajax jQuery整理笔记九----功能性表格开发

jquery 整理笔记(一)

this:表示当前的上下文对象是一个html对象,可以调用html对象所拥有的属性,方法 $(this),代表的上下文对象是一个jquery的上下文对象,可以调用jquery的方法和属性值. each: jquery遍历函数,为每个匹配元素执行函数. 可以遍历一维数组.多维数组.DOM, JSON等. find() 方法获得当前元素集合中每个元素的后代,通过选择器.jQuery 对象或元素来筛选.(不是普通的dom对象 是jquery封装过以后的对象) jquery dom 元素方法  dom包

jQuery整理笔记9----函数形式发展

在一些照片中使用演示样本.插入.样式文件下载:点我进入下载 过去在开发过程中关于table方面的jquery应用不过局限于使用jquery操作table添加一行.删除一列等等操作.今天整理的跟过去用的不一样. 1.uiTableFilter uiTableFilter是一款表格数据行过滤插件,使用非常easy,详细使用方法例如以下: $.uiTableFilter(table,phrase)  该函数包括两个參数,当中第一个參数为jQuery对象,即为jQuery方法匹配的表格,或者也能够是jQ

jQuery整理2

七.jQuery效果 (1)jQuery隐藏和显示 //隐藏 $("#hide").click(function(){ $("p").hide(1000); }); //显示 $("#show").click(function(){ $("p").show(1000); }); //隐藏/显示 $("#toggle").click(function(){ $("p").toggle(10

jQuery整理1

一.初识jQuery jQuery是一个JavaScript函数库.主要包含的功能有:HTML元素的选取.操作,CSS操作,HTML事件函数,JavaScript特效和动画,HTML DOM遍历和修改,AJAX,Utilities. 二.引入jQuery 向网页中添加jQuery有两种方式(1):从jQuery官网下载jQuery库,然后在网页中引入.(2):从CDN中载入jQuery,常用的有百度和新浪的库,链接如:http://apps.bdimg.com/libs/jquery/2.1.4