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 1.0.4 - New Wave Javascript(js源文件)
Jan 15 Javascript
javascript 写类方式之十
Jul 05 Javascript
JavaScript DOM 学习第二章 编辑文本
Feb 19 Javascript
上传的js验证(图片/文件的扩展名)
Apr 25 Javascript
jquery实现带二级菜单的导航示例
Apr 28 Javascript
JS实现霓虹灯文字效果的方法
Aug 06 Javascript
jQuery中的siblings用法实例分析
Dec 24 Javascript
node作为中间服务层如何发送请求(发送请求的实现方法详解)
Jan 02 Javascript
浅谈webpack打包之后的文件过大的解决方法
Mar 07 Javascript
angular4强制刷新视图的方法
Oct 09 Javascript
JS使用new操作符创建对象的方法分析
May 30 Javascript
新手入门带你学习JavaScript引擎运行原理
Jun 24 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数组对百万数据进行排除重复数据的实现代码
2010/06/08 PHP
PHP实现上传图片到 zimg 服务器
2016/10/19 PHP
Google Map Api和GOOGLE Search Api整合实现代码
2009/07/18 Javascript
JavaScript 精粹读书笔记(1,2)
2010/02/07 Javascript
js字母大小写转换实现方法总结
2013/11/13 Javascript
jquery遍历筛选数组的几种方法和遍历解析json对象
2013/12/13 Javascript
Jquery.Form 异步提交表单的简单实例
2014/03/03 Javascript
JavaScript获取按钮所在form表单id的方法
2015/04/02 Javascript
JavaScript实现鼠标滑过图片变换效果的方法
2015/04/16 Javascript
JavaScript和HTML DOM的区别与联系及Javascript和DOM的关系
2015/11/15 Javascript
JavaScript字符串删除重复字符的方法
2015/12/25 Javascript
jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍
2016/09/01 Javascript
基于bootstrap-datetimepicker.js不支持IE8的快速解决方法
2016/11/07 Javascript
vue.js实现表格合并示例代码
2016/11/30 Javascript
js实现可输入可选择的select下拉框
2016/12/21 Javascript
js实现颜色阶梯渐变效果(Gradient算法)
2017/03/21 Javascript
Bootstrap + AngularJS 实现简单的数据过滤字符查找功能
2017/07/27 Javascript
基于Vue 2.0 监听文本框内容变化及ref的使用说明介绍
2018/08/24 Javascript
详解Vue-axios 设置请求头问题
2018/12/06 Javascript
使用vue自定义指令开发表单验证插件validate.js
2019/05/23 Javascript
Vue表单提交点击事件只允许点击一次的实例
2020/10/23 Javascript
[01:30]2016国际邀请赛中国区预选赛神秘商店火爆开启
2016/06/26 DOTA
[38:39]完美世界DOTA2联赛循环赛 IO vs GXR BO2第二场 11.04
2020/11/05 DOTA
Python求两个list的差集、交集与并集的方法
2014/11/01 Python
深入解析Python的Tornado框架中内置的模板引擎
2016/07/11 Python
python爬虫添加请求头代码实例
2019/12/28 Python
解决pyqt5异常退出无提示信息的问题
2020/04/08 Python
python爬取2021猫眼票房字体加密实例
2021/02/19 Python
css3实现动画的三种方式
2020/08/24 HTML / CSS
HTML5 Canvas图像模糊完美解决办法
2018/02/06 HTML / CSS
Fabletics官网:美国运动服饰品牌,由好莱坞女演员凯特·哈德森创立
2019/10/19 全球购物
政府法律服务方案
2014/06/14 职场文书
个人汇报材料范文
2014/12/30 职场文书
学生个人评语大全
2015/01/04 职场文书
2015年思想品德教学工作总结
2015/07/22 职场文书
vue组件冲突之引用另一个组件出现组件不显示的问题
2022/04/13 Vue.js