jQuery的一些特性和用法整理小结


Posted in Javascript onJanuary 13, 2010

1.精准简单的选择对象(dom):

$('#element');// 相当于document.getElementById 
("element") 
$('.element');//Class 
$('p');//html标签 
$("form > input");//子对象 
$("div,span,p.myClass");//同时选择多种对象 
$("tr:odd").css("background-color", "#bbbbff");//表格的 
隔行背景 
$(":input");//表单对象 
$("input[name='newsletter']");//特定的表单对象

2.对象函数的应用简单和不限制:
element.function(par); 
$(”p.surprise”).addClass(”ohmy”).show(”slow”)...

3.对已选择对象的操作(包括样式):
$("#element").addClass("selected");//给对象添加样式 
$('#element').css({ "background-color":"yellow", "font 
-weight":"bolder" });//改变对象样式 
$("p").text("Some new text.");//改变对象文本 
$("img").attr({ src: "test.jpg", alt: "Test Image" 
});//改变对象文本 
$("p").add("span");//给对象增加标签 
$("p").find("span");//查找对象内部的对应元素 
$("p").parent();//对象的父级元素 
$("p").append("<b>Hello</b>");//给对象添加内容

4.支持aJax,支持文件格式:xml/html/script/json/jsonp
$("#feeds").load("feeds.html");//相应区域导入静态页内容 
$("#feeds").load("feeds.php", {limit: 25}, function() 
{alert("The last 25 entries in the feed have been 
loaded");});//导入动态内容

5.对事件的支持:
$("p").hover(function () { 
$(this).addClass("hilite");//鼠标放上去时 
}, function () { 
$(this).removeClass("hilite");//移开鼠标 
});//鼠标放上去和移开的不同效果(自动循环所有p对象 
)

6.动画:
$("p").show("slow");//隐藏对象(慢速渐变) 
$("#go").click(function(){ 
$("#block").animate({ 
width: "90%", 
height: "100%", 
fontSize: "10em" 
}, 1000 ); 
});//鼠标点击后宽、高、字体的动态变化

7.扩展:
$.fn.background = function(bg){ 
return this.css('background', bg); 
}; 
$(#element).background("red");
Javascript 相关文章推荐
jQuery中bind与live的用法及区别小结
Jan 27 Javascript
javascript查询字符串参数的方法
Jan 28 Javascript
javascript 对象数组根据对象object key的值排序
Mar 09 Javascript
纯HTML5制作围住神经猫游戏-附源码下载
Aug 23 Javascript
js中不同的height, top的区别对比
Sep 24 Javascript
jQuery 常用代码集锦(必看篇)
May 16 Javascript
JavaScript中最容易混淆的作用域、提升、闭包知识详解(推荐)
Sep 05 Javascript
JS实现类似51job上的地区选择效果示例
Nov 17 Javascript
ThinkJS中如何使用MongoDB的CURD操作
Dec 13 Javascript
js运算符的一些特殊用法
Jul 29 Javascript
js与jquery获取input输入框中的值实例讲解
Feb 27 jQuery
带你使用webpack快速构建web项目的方法
Nov 12 Javascript
JavaScript关于select的相关操作说明
Jan 13 #Javascript
海量经典的jQuery插件集合
Jan 12 #Javascript
JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
Jan 12 #Javascript
jquery下操作HTML控件的实现代码
Jan 12 #Javascript
jquery插件 cluetip 关键词注释
Jan 12 #Javascript
Javascript 实现TreeView CheckBox全选效果
Jan 11 #Javascript
javascript下判断一个对象是否具有指定名称的属性的的代码
Jan 11 #Javascript
You might like
PHP安全防范技巧分享
2011/11/03 PHP
判断php数组是否为索引数组的实现方法
2013/06/13 PHP
php中apc缓存使用示例
2013/12/25 PHP
Smarty高级应用之缓存操作技巧分析
2016/05/14 PHP
php+mysql+ajax实现单表多字段多关键词查询的方法
2017/04/15 PHP
图片自动更新(说明)
2006/10/02 Javascript
ext监听事件方法[初级篇]
2008/04/27 Javascript
JQuery验证工具类搜集整理
2013/01/16 Javascript
浅析JQuery获取和设置Select选项的常用方法总结
2013/07/04 Javascript
二叉树的非递归后序遍历算法实例详解
2014/02/07 Javascript
node.js中的fs.lchmodSync方法使用说明
2014/12/16 Javascript
JS实现表格数据各种搜索功能的方法
2015/03/03 Javascript
windows下安装nodejs及框架express
2015/08/07 NodeJs
jquery判断复选框是否选中进行答题提示特效
2015/12/10 Javascript
基于Node.js实现nodemailer邮件发送
2016/01/26 Javascript
vue-cli的webpack模板项目配置文件分析
2017/04/01 Javascript
Vue2.5 结合 Element UI 之 Table 和 Pagination 组件实现分页功能
2018/01/26 Javascript
jQuery实现导航样式布局操作示例【可自定义样式布局】
2018/07/24 jQuery
jQuery实现验证用户登录
2019/12/10 jQuery
在项目vue中使用echarts的操作步骤
2020/09/07 Javascript
js+canvas绘制图形验证码
2020/09/21 Javascript
python服务器端收发请求的实现代码
2014/09/29 Python
Python中字典的基本知识初步介绍
2015/05/21 Python
浅析Python中的赋值和深浅拷贝
2017/08/15 Python
在python 不同时区之间的差值与转换方法
2019/01/14 Python
Spring实战之使用util:命名空间简化配置操作示例
2019/12/09 Python
flask框架中的cookie和session使用
2021/01/31 Python
利用CSS3动画实现圆圈由小变大向外扩散的效果实例
2018/09/10 HTML / CSS
Chantelle仙黛尔内衣美国官网:法国第一品牌内衣
2018/07/26 全球购物
投标诚信承诺书
2014/05/26 职场文书
后勤工作个人总结
2015/02/28 职场文书
物业工程部主管岗位职责
2015/04/16 职场文书
2016春季小学开学寄语
2015/12/03 职场文书
面试必问:圣杯布局和双飞翼布局的区别
2021/05/13 HTML / CSS
Python基础学习之奇异的GUI对话框
2021/05/27 Python
Zabbix6通过ODBC方式监控Oracle 19C的详细过程
2022/09/23 Servers