Web前端新人笔记之jquery入门心得(新手必看)
本章将为大家介绍以下几点内容;
1、jquery的主要特点;
2、建立jquery的编码环境;
3、简单jquery脚本示例;
4、选择jquery而不是纯javaScript的理由;
5、常用的jquery开发工具;jquery能做什么?
① 取得文档中的元素
$('div.content').find('p');
② 修改页面的外观
$('ul > li:first').addClass('active');
③ 改变文档内容
$('#container').append('<a href="www.baidu,com">more</a>')
④ 为页面添加动态效果
$('div.content').slideDown();
⑤ 响应用户的交互操作
$('button.show-details').click(function(){ $('div.details').show(); });
⑥ 无需刷新页面从服务器获取信息
$('div.details').load('more.html #content');
⑦ 简化常见的javaScript任务
$.each(obj, function(key,value)(total += value;));
jquery为何如此出色?
1、利用了CSS的优势;
2、支持扩展;
3、抽象浏览器不一致;
4、总是面向集合;
5、将多重操作基于一行;
如何下载jquery?
1、由于JavaScript是一种解释语言,所以不必担心编译和构建。什么时候需要使用jquery,只要在HTML文档中使用<script>元素把它导入进来即可。
2、jquery官网:http://jquery.com/
都有哪些开发测试工具?
现代浏览器中一般内置了高质量的开发工具,我们可以选择自己觉得方便的工具,一下列出了一些推荐工具:
1、IE;
2、Safari;
3、Chrome;
4、Firefox;
5、Opera;
上面列出来的这些工具都提供了类似的功能:
1、探测及修改DOM;
2、研究CSS及页面变现之间的关系;
3、通过特殊的方法方便的跟踪脚本执行;
4、暂停脚本执行及检查变量值
以上这篇Web前端新人笔记之jquery入门心得(新手必看)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
30个经典的jQuery代码开发技巧
本文实例总结了30个经典的jQuery代码开发技巧.分享给大家供大家参考.具体如下: 1. 创建一个嵌套的过滤器 复制代码 代码如下: .filter(":not(:has(.selected))") //去掉所有不包含class为.selected的元素 2. 重用你的元素查询 复制代码 代码如下: var allItems = $("div.item"); var keepList = $("div#container1 div.item")
-
jQuery Ajax使用心得详细整理及注意事项
IE7及以下请求方式用GET的话,URL的限制是个很容易忽视的问题(最大2083个字符).所以如果URL有可能过长的话,一定要用POST. -------------------------------------------------------------------------------- 终止Ajax请求 终止请求需要调用XMLHttpRequest对象的abort()方法 而在jQuery中的$.get,$.post.$.ajax.$.getJSON.$.getScript...的
-
全面详细的jQuery常见开发技巧手册
本文为大家整理一篇很详尽的jQuery常见开发技巧文章,供大家参考,具体内容如下 1.关于页面元素的引用 通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法. 2.jQuery对象与dom对象的转换 只有jquery对象才能使用jquery定义的方法.注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象. 普通的d
-
关于Jqzoom的使用心得 jquery放大镜效果插件
下面是完整的代码 jqzoom打包下载地址 复制代码 代码如下: <html> <head> <title>JQzoom Demo</title> <script src="../js/jquery-1.3.2.min.js" type="text/javascript"></script> <script src="../js/jqzoom.pack.1.0.1.js"
-
jQuery 研究心得 取得属性的值
如何取得属性的值? Html: <div Bruce="Yes">sss</div> 取得属性自定义属性 Bruce 的值: alert($("div[@Bruce]").attr("Bruce")); 取得属性Bruce为Yes的Div的内容: alert($("div[@Bruce]").html()); alert($("div[@Bruce=Yes]").html());
-
关于jQuery UI 使用心得及技巧
1 jQuery UI 2 为我所用 2.1 Tabs 2.2 Accordion 2.2.1 使用基本的Accordion 2.2.2 实现打开多个标签 2.2.3 Accordion的嵌套 3 给插件应用主题--Theme Roller 3.1 更改配色 3.2 更改图标 4 相关连接 jQuery UI 有时你仅仅是为了实现一个渐变的动画效果而不得不把javascrip 重新学习一遍然后书写大量代码.直到jQuery的出现,让开发人员从一大堆繁琐的js代码中解脱,取而代之几行jQuery代
-
Jquery ThickBox插件使用心得(不建议使用)
大家可以使用官方推荐的一下几个插件 复制代码 代码如下: While Thickbox had its day, it is not maintained any longer, so we recommend you use some alternatives. * colorbox * jQueryUI Dialog * fancybox * DOM window * shadowbox.js 做项目中发现facebox如果快速单击两下,容易出现黑屏.而且facebox的框架是用table写
-
60个很实用的jQuery代码开发技巧收集
由于内容比较多建议用CTRL+F搜索 偶然在网上看到这些不错的jQuery代码开发技巧.原文收集了30个,另外查找的时候发现了还有20个.加上另外十个实用的jQuery代码片段,共60个代码技巧,收集在一起分享给大家. 1. 创建一个嵌套的过滤器 .filter(":not(:has(.selected))") //去掉所有不包含class为.selected的元素 2. 重用你的元素查询 var allItems = $("div.item"); var keep
-
15个值得开发人员关注的jQuery开发技巧和心得总结【经典收藏】
本文总结述了15个值得开发人员关注的jQuery开发技巧和心得.非常精辟实用!分享给大家供大家参考,具体如下: 在这篇文章中,我们将介绍15个让你的jQuery更加有效的技巧,大部分关于性能提升的,希望大家能够喜欢! 1. 尽量使用最新版本的jQuery类库 jQuery项目中使用了大量的创新.最好的方法来提高性能就是使用最新版本的jQuery.每一个新的版本都包含了优化的bug修复.对我们来说唯一要干的就是修改tag,何乐而不为呢? 我们也可以使用免费的CDN服务,例如, Google来存放j
-
php+jquery编码方面的一些心得(utf-8 gb2312)
php 文件应存为ANSI,要改编码时可用代码调. 复制代码 代码如下: //编码为gb2312,目前大部分网页还是用gb2312,少部分用utf-8, //www.baidu.com竟然两个都用,所以读取baidu的网页怎么搞都没问题 header('Content-Type: text/html; charset=gb2312'); //编码为utf-8 header('Content-Type: text/html; charset=gb2312'); //编码xml为utf-8,不过好像
-
jQuery常见开发技巧详细整理
1.关于页面元素的引用 通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法. 2.jQuery对象与dom对象的转换 只有jquery对象才能使用jquery定义的方法.注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象. 普通的dom对象一般可以通过$()转换成jquery对象. 如:$(document.ge
-
jquery easyui使用心得
第一步下载jquery easyui 下载地址:http://www.jb51.net/codes/70218.html 第二步创建Java web项目 第三步导入相关的文件..目录结构如下 <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" rel="external nofollow" rel="ext
-
jQuery 使用个人心得
$("标签名") //取html元素 document.getElementsByTagName("") $("#ID") //取单个控件document.getElementById("") $("div #ID") //取某个控件中 控件 $("#ID #ID") // 通过控件ID取其中的控件 $("标签.class样式名") //通过class来取控件 $(&
随机推荐
- PowerShell中的特殊变量$null介绍和创建多行注释小技巧
- jdbc 数据库的连接(sqlserver oracle)
- 一张表格告诉你windows.onload()与$(document).ready()的区别
- 学习ExtJS Column布局
- vue.js通过自定义指令实现数据拉取更新的实现方法
- java在网页上面抓取邮件地址的方法
- perl去除重复内容的脚本代码(重复行+数组重复字段)
- asp.net GridView控件中模板列CheckBox全选、反选、取消
- 灵活应用js调试技巧解决样式问题的步骤分享
- IE与Firefox在JavaScript上的7个不同写法小结
- CodeIgniter实现从网站抓取图片并自动下载到文件夹里的方法
- THREE.JS入门教程(2)着色器-上
- JS中处理时间之setUTCMinutes()方法的使用
- JS实现漂亮的窗口拖拽效果(可改变大小、最大化、最小化、关闭)
- linux中shell脚本实现下载完关机
- 都是IE惹的祸多浏览器兼容问题
- SQL Server中删除重复数据的几个方法
- JavaFX 监听窗口关闭事件实例详解
- Python编程中的文件读写及相关的文件对象方法讲解
- php一些公用函数的集合