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一些基础笔记的更多相关文章

  1. jQuery官方基础教程笔记(转载)

    本文转载于阮一峰的博文,内容基础,结构清晰,是jquery入门不可多得的资料,非常好,赞一个. 阮一峰:jQuery官方基础教程笔记 jQuery是目前使用最广泛的javascript函数库. 据统计 ...

  2. 【学习笔记】jQuery的基础学习

    [学习笔记]jQuery的基础学习 新建 模板 小书匠  什么是jQuery对象? jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果 ...

  3. jQuery源代码学习笔记_工具函数_noop/error/now/trim

    jQuery源代码学习笔记_工具函数_noop/error/now/trim jquery提供了一系列的工具函数,用于支持其运行,今天主要分析noop/error/now/trim这4个函数: 1.n ...

  4. HTML5基础——笔记

    HTML5基础——笔记 近几年来,互联网+.大数据.云计算‘物联网‘虚拟现实‘人工智能.机器学习.移动互联网等IT相关新名词.新概念层出不穷,相关产业发展如火如荼.互联网+移动互联网已经深入到人民日常 ...

  5. [DOM Event Learning] Section 3 jQuery事件处理基础 on(), off()和one()方法使用

    [DOM Event Learning] Section 3 jQuery事件处理基础 on(),off()和one()方法使用   jQuery提供了简单的方法来向选择器(对应页面上的元素)绑定事件 ...

  6. jQuery 插件基础

    jQuery 插件基础 翻译 How to Create a Basic Plugin 如果你需要在 jQuery 选择器上执行一系列重复操作, 这时候你需要编写 jQuery 插件. jQuery ...

  7. Java基础笔记 – Annotation注解的介绍和使用 自定义注解

    Java基础笔记 – Annotation注解的介绍和使用 自定义注解 本文由arthinking发表于5年前 | Java基础 | 评论数 7 |  被围观 25,969 views+ 1.Anno ...

  8. jquery插件开发基础入门

    jquery插件开发基础入门 入门 编写一个jquery插件开始于给jquery.fn加入新的功能属性,此处添加的对象属性的名称就是你的插件名称 jQuery.fn,myPlugin = functi ...

  9. php代码审计基础笔记

    出处: 九零SEC连接:http://forum.90sec.org/forum.php?mod=viewthread&tid=8059 --------------------------- ...

随机推荐

  1. Java中的代理模式

    代理模式在Java Web的框架中经常使用到.比如说在对数据库的访问中,核心功能是对数据库的增删改查,而连接数据库.处理事务等功能我们在开发中也要考虑到.所以我们将数据库的CRUD抽象到接口中,然后实 ...

  2. 因开启SELinux导致httpd报403

    各项权限都检查过了,SELinux允许的端口也找过了.同目录下的其他文件夹是正常的,这个文件夹就抱403. 临时关闭selinux后正常.估计是没有配置运行上下文. chcon -R -t httpd ...

  3. Django model 中meta options之 abstract

    当abstract=True时,这个model就变成了abstrct base class,那这个基类有什么特性呢? 当某一model中设置了abstract=True时,就会使该model中的字段都 ...

  4. JAVA设计模式之门面模式

    在阎宏博士的<JAVA与模式>一书中开头是这样描述门面(Facade)模式的: 门面模式是对象的结构模式,外部与一个子系统的通信必须通过一个统一的门面对象进行.门面模式提供一个高层次的接口 ...

  5. Jmeter学习一:Jmeter性能测试环境搭建(Windows下)

    最近刚开始接触Jmeter性能测试,现总结环境搭建如下: 一.windows安装JDK步骤与环境变量配置: 1.先将下载的JDK安装到其默认目录:C:\Program Files\Java\jdk1. ...

  6. 【转】提高VR渲染速度的关键

    提高VR渲染速度的关键,这个教程比以往的教程都要重要很多,如果你是刚刚步入学习和上升阶段那么这将是你必须要看的东西,他会让你迅速提升技能达到比你死看书本好很多的效果,不多说上教程   VR的基本渲染方 ...

  7. PCI Express(一)- Connector

    在FPGA4FUN上看到一篇介绍PCI-E的帖子,简单易懂,适合入门,特地搬过来 原文地址:http://www.fpga4fun.com/PCI-Express.html 前言: As PCI Ex ...

  8. boost compile

    pushd E:\boost\boost_1_59_0 b2 stage --toolset=msvc-12.0 --without-python --stagedir="E:\boost\ ...

  9. PIC32MZ tutorial -- Watchdog Timer

    Watchdog is a very necessary module for embedded system. Someone said that embedded system operates ...

  10. js鼠标点击版tab切换

    代码很简单,主要是布局需要用心研究下,使用时需要把css内注释去除 <!DOCTYPE html> <head> <meta http-equiv="Conte ...