Jquery 入门知识

标签: jquery 知识 | 发表时间:2014-02-26 23:27 | 作者:毛亚峰
出处:http://www.iteye.com

<div class="iteye-blog-content-contain" style="font-size: 14px">

    1、JQuery的优点:

1)体积小(导入的js文件小的有50多KB,大点的一百多KB);

2)速度快(Js和JQuery 整体的速度相比,JQuery的速度要快于js);

3)屏蔽浏览器之间的差异(例如:js写ajax时要判断一下浏览器);

4)运用广泛有很多插件支持(例如Tree插件);

5)强大的dom搜索功能;

6)支持ajax

2、简述一下常见的几个js框架:

1)domj、prototype:这两个框架比较早,现在用的不多了。

2)extjs:它主要是可以把网页做成像windows 的界面一样,现在用的也不少。

3)dwr(ajax) :主要倾向于ajax,本人用不习惯。

3、js 的几种获取标签的方式:

1)id   document.getElementById();

2)tag   document.getElementByTagName();

3)name document.getElementByName();

4、JQuery的onload事件:

 js写法:

 

window.onload=helloworld;

function helloworld(){

alert('hello world');
}
Jquery 写法 
$( helloworld);

function helloworld(){

alert('hello world');
}
 
JQuery通常的写法匿名方法 
$(function(){
alert('hello word')
});
 

 5、Jquery 的数组创建和遍历:数组的创建时用中括号“[  ]”,each 方法相当于java中的静态方法,两个参数一个是数组的序号;一个是callback 回调,也就是一个类似java的一个匿名内部类,在里面做操作。 

数组 
var arr=["a","b","c"];
$.each(arr,function(index,value){
alert(index+" "+value);
});

 6、Map的创建和遍历:map的遍历和数组的遍历很像。

map
var map={1:"a",china:"b",3:"c"};
$.each(map,function(key,value){
   alert(key+" "+value);
});

alert(map.china); //当key是字符串时,可以用这中方法获取map的值。key是数 值型的不能这样
alert(map[1]);// 当key是数值型的时候这样获取map的值。
  

 7、创建js 对象:定义三个人的数组,遍历数组打印数组信息。

js对象 
var user={id:1,name:"admin",age:18}//创建一个user对象

var users=[
{id:1,name:"admin",age:18},
{id:2,name:"admin1",age:88},
{id:3,name:"admin2",age:98}
];
$.each(users,function(index,user){
alert(user.id+" "+user.name+" "+user.age);
});

 8、用jquery改变页面的样式:选择器:. class、#id 、element 例子:标签的序号是从0开始

 
$(function(){
$("#a").css("color","red");//id="a" 的标签
$(".b").css("color","green"); class=“b”的标签
$("p").css("color",blue); 标签P的
});

 

 

$("p:not(:eq(1))").css("color","white");//p标签不等于第二行的样式改为白色。

$("tr:even").css("background-color","red");//tr标签的基数行背景为红色。
$("tr:odd").css("background-color","green");偶数行
$("tr:lt(3)").css("background-color","pink")前三行为粉色

 9、对多个复选框的操作:this当前对象。

 
function selectAll() //复选框全选。
$("input[type=checkbox][name=music]").attr("checked",true);
}

function selectNone(){//
$("input[type=checkbox][name=music]").attr("checked",false);
}
function selectOther(){
$("input[type=checkbox][name=music]").each(function(){
var flag = $(this) .attr("checked"); //获取值和set值都是attr
$(this).attr("checked",!flag);// this 是遍历到当前节点
});
}

 10、这是一个级联选择,有父节点,子节点。

 

    

 11、获取评论信息放到下面的li中

 


 

12这是对图片的操作:

 


 

13.常见的几种表单属性的值的获取和重置:

 



 



 

14、Ajax例子:常见注册页面用户名:是否能用。这是一个和struts整合的需要配置action的。

      这是一个参数的例子。



 



15、这是一个请求,返回一个json对象。

 

 

 

 

 

 

 

</div>

 



已有 0 人发表留言,猛击->> 这里<<-参与讨论


ITeye推荐



相关 [jquery 知识] 推荐:

jQuery知识总结

- - 博客园_iTech's Blog
转自: http://www.cnblogs.com/oec2003/archive/2013/04/13/3017731.html. 原作者:  oec2003(水杯) . 出处:     http://oec2003.cnblogs.com/ . 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则 保留追究法律责任的权利.

Jquery 入门知识

- - Web前端 - ITeye博客
    1、JQuery的优点:. 1)体积小(导入的js文件小的有50多KB,大点的一百多KB);. 2)速度快(Js和JQuery 整体的速度相比,JQuery的速度要快于js);. 3)屏蔽浏览器之间的差异(例如:js写ajax时要判断一下浏览器);. 4)运用广泛有很多插件支持(例如Tree插件);.

JQuery 选择器

- - CSDN博客Web前端推荐文章
}

点击我

.    像上面这样把JavaSript代码和HTML代码混杂在一起的做法同样也非常不妥,因为它并没有将网页内容和行为分离,所以才有JQuery选择器的学习.

点击我

. //给class为demo的元素添加行为.

jquery操作xml

- - CSDN博客Web前端推荐文章
jquery真的很强大,虽然一直在用jquery,不用一直都没有深入,这几天重新学习了一下,不得不感叹她的强大,已经让我深深入迷. 这里记录一下,她是怎么快速地操作xml的.. 这里我们有一个xml文件:. jquery如何操作呢,总的思想,就是和操作dom差不多的方法. 首先我们获取这个文件的内容:(我先引入jquery库哈).

jQuery JSONP跨域

- - Web前端 - ITeye博客
基于Jquery的Ajax跨域访问. 单点登录服务器(sso服务器). 登录网页项目的时候,由于使用了单点登录,所以页面会跳转到sso服务器,进行统一登录,. 现在需要在该界面增加令牌的认证,但是SSO服务器和令牌服务器部署在不同的服务器,且暂时没有要合并的可能,所以在SSO登录的时候必须要对令牌进行验证,就必须涉及到了跨域访问的问题.

jquery 插件

- - JavaScript - Web前端 - ITeye博客
 jQuery插件的开发包括两种:. 一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery类本身添加方法. jQuery的全局函数就是属于jQuery命名空间的函数,另一种是对象级别的插件开发,即给jQuery对象添加方法. 下面就两种函数的开发做详细的说明. 1 、类级别的插件开发.

让jquery更快

- - JavaScript - Web前端 - ITeye博客
很久没有关注jQuery了,最近重新看了一下,看到一些不错的文章,转来坐一下笔记. 其内容和一些新提供的方法还是很多有值得学习的地方. 使用最新版本的jQuery. jQuery的版本更新很快,你应该总是使用最新的版本. 因为新版本会改进性能,还有很多新功能. 下面就来看看,不同版本的jQuery性能差异有多大.

jQuery Tools:Web开发必备的 jQuery UI 库

- - 博客园_首页
jQuery Tools 是基于. jQuery 开发的网站界面库,包含网站最常用的Tabs(选项卡)、Tooltip(信息提示)、Overlay(遮罩、弹窗)、Scrollable(滚动控制)、Form Validator(表单验证)、Rangeinput(范围选择)、Dateinput(日期选择)等众多功能.

jQuery基础之jQuery的DOM操作

- - CSDN博客推荐文章
 为了能全面地讲解DOM操作,首先需要构建一个网页. 因为每一张网页都能用DOM表示出来,而每一份DOM都可以看作一棵DOM树.    

你最喜欢的水果是?

 .      
  • 苹果
  •  .      
  • 橘子
  •  .

    jQuery最佳实践

    - andi - 阮一峰的网络日志
    上周,我整理了《jQuery设计思想》. 那篇文章是一篇入门教程,从设计思想的角度,讲解"怎么使用jQuery". 今天的文章则是更进一步,讲解"如何用好jQuery". 我主要参考了Addy Osmani的PPT《提高jQuery性能的诀窍》(jQuery Proven Performance Tips And Tricks).