JQuery一些基础笔记
JQuery学完了,总结一下一些需要掌握的知识点。
首先什么是JQuery 说白了就是有JavaScript衍生出来的一个产物,它呢兼容各种浏览器,但是前提你要用这个JQ的话首先呢你就要引入JQ库。
学过js的人在学jq你就会感觉jq简直是很简单的代码就给js的功能实现了。建议先去学一下js在来学jq这样会好理解一点。
一、基础
类似于js中的window.onload,是在窗体加载完成后在执行。
例:$(function()
{
alert("HelloWorld");
});
JQ元素和DOM元素呢就是JQ元素名是由$开头的,不带$的呢就是普通的js元素了
二、选择器
这个jq呢有很多选择器死记硬背呢确实不好记程序就是这样写多了自然而然的就会了
三、DOM
append()
-- 向元素中添加内容
appendTo()
-- 将元素添加到指定内容
包裹节点:
$(function()
{
$(“span”).wrap(“<strong></strong>”);
})
设置属性:
$("元素").attr({键值对});同样也可以设置css属性 $(“p”).attr(“class”,”high”);$("a:contains('link')").attr({"href":“index.html","title":"test"});
attr(这里是键值对)
追加样式:
$(“p”).addClass(“another”);toggle事件:
也就是相当于链接式点击事件第一次点击执行第一个函数块代码第二次点击执行第二个代码块,以此类推。
设置和获取HTML的文本值
1、html()
2、text()
3、val()
四、事件
1.bind()绑定事件 --- unbind()移出事件
$(function(){
$("#panel h5.head").bind("mouseover",function(){
$(this).next().show();
});
$("#panel h5.head").bind("mouseout",function(){
$(this).next().hide();
})
})
1.hover()用于光标的模拟,第一次悬停触发一次,鼠标移出在触发一次
$(function(){
$("#panel h5.head").hover(function(){
$(this).next().show();},function(){
$(this).next().hide();
})
})
2.toggle()被选中元素轮流响应click事件
$("td").toggle(
function () {
$(this).addClass("selected");
},
function () {
$(this).removeClass("selected");
}
);
五、动画
1.show() -- 显示
2.hide() -- 隐藏
3.fadeIn() -- 颜色逐渐变深
4.fadeOut() -- 颜色逐渐变浅
5.slideUp()-- 向上延伸
6.slideDown() -- 向下延伸
7.animated() -- 动画
$("#panel").click(function(){
$(this).animate({left: "500px"}, 3000);
})
这些动画可以和事件组合起来用
Ajax另外有介绍
JQuery一些基础笔记的更多相关文章
- jQuery官方基础教程笔记(转载)
本文转载于阮一峰的博文,内容基础,结构清晰,是jquery入门不可多得的资料,非常好,赞一个. 阮一峰:jQuery官方基础教程笔记 jQuery是目前使用最广泛的javascript函数库. 据统计 ...
- 【学习笔记】jQuery的基础学习
[学习笔记]jQuery的基础学习 新建 模板 小书匠 什么是jQuery对象? jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果 ...
- jQuery源代码学习笔记_工具函数_noop/error/now/trim
jQuery源代码学习笔记_工具函数_noop/error/now/trim jquery提供了一系列的工具函数,用于支持其运行,今天主要分析noop/error/now/trim这4个函数: 1.n ...
- HTML5基础——笔记
HTML5基础——笔记 近几年来,互联网+.大数据.云计算‘物联网‘虚拟现实‘人工智能.机器学习.移动互联网等IT相关新名词.新概念层出不穷,相关产业发展如火如荼.互联网+移动互联网已经深入到人民日常 ...
- [DOM Event Learning] Section 3 jQuery事件处理基础 on(), off()和one()方法使用
[DOM Event Learning] Section 3 jQuery事件处理基础 on(),off()和one()方法使用 jQuery提供了简单的方法来向选择器(对应页面上的元素)绑定事件 ...
- jQuery 插件基础
jQuery 插件基础 翻译 How to Create a Basic Plugin 如果你需要在 jQuery 选择器上执行一系列重复操作, 这时候你需要编写 jQuery 插件. jQuery ...
- Java基础笔记 – Annotation注解的介绍和使用 自定义注解
Java基础笔记 – Annotation注解的介绍和使用 自定义注解 本文由arthinking发表于5年前 | Java基础 | 评论数 7 | 被围观 25,969 views+ 1.Anno ...
- jquery插件开发基础入门
jquery插件开发基础入门 入门 编写一个jquery插件开始于给jquery.fn加入新的功能属性,此处添加的对象属性的名称就是你的插件名称 jQuery.fn,myPlugin = functi ...
- php代码审计基础笔记
出处: 九零SEC连接:http://forum.90sec.org/forum.php?mod=viewthread&tid=8059 --------------------------- ...
随机推荐
- Data Science at the Command Line学习笔记(二)
1.vagrant建立简单httpserver方法: 1)映射端口 修改Vagrantfile, 末尾添加本地端口和虚机端口的映射关系, 然后执行vagrant reload. Vagrant::Co ...
- Mono addin 学习笔记 1
Mono Addin是一个开源的插件框架,其主要支持的特性如下: The main features of Mono.Addins are: Supports descriptions of add- ...
- 关于sublime text2
转自:http://www.qianduan.net/essential-to-sublime-the-text-2-plugins.html Sublime Text 2是一个轻量.简洁.高效.跨平 ...
- web_reg_find()函数的使用
1.此函数的作用,很显然就是能告之测试人员页面是否显示正确,其意义与价值在我此次支撑平台的性能测试得到了体现. 2.在使用此函数的过程中,遇到了非常郁闷的事情,幸得老大的帮助才得以跳出误区.当在此函数 ...
- ERROR 1267 (HY000): Illegal mix of collations (utf8_general_ci,IMPLICIT) and (utf8_unicode_ci,IMPLICIT) for operation '='
多表查询出错,貌似是编码问题. 我比较的两个表的某个字段,设为查询条件,两个字段等于某个值,参照网上的某些论坛调用alter语句,但是依旧没有效果.最后直接拆分成两个条件,a.字段1=x值,b.字段2 ...
- TCP协议总结--停止等待协议,连续ARQ协议,滑动窗口协议
前言:在学习tcp三次握手的过程之中,由于一直无法解释tcpdump命令抓的包中seq和ack的含义,就将tcp协议往深入的了解了一下,了解到了几个协议,做一个小结. 先来看看我的问题: 这是用tcp ...
- Java web--反射(解刨)
本质:先加载类 再解刨类的方法,字段,构造函数 目的:解刨出构造函数 为了new对象 解刨出字段 为了封装数据进去 解刨方法 ...
- {Reship}{ListView}C# ListView用法详解
======================================================================== This aritcle came from http ...
- ngx.lua中遇到的小问题
作者: 胡 志伟 分类: ngx_lua, 开发代码 发布时间: 2013-09-26 08:40 ė 6评论关闭 在使用ngx.redirect 到一个新的地址时,错误日志提示: lua entry ...
- JAVA课程实验报告 实验三 敏捷开发与XP实践
北京电子科技学院(BESTI) 实 验 报 告 课程:Java程序设计 班级:1353 姓名:韩玉琪 学号:20135317 成绩: 指导教师:娄嘉 ...