强哥jQuery学习笔记
js对象:
1.js内置对象
2.js元素对象
3.jquery对象
js特效:
1.js元素对象
2.jQuery对象
jQuery学习:
1.核心函数
2.选择器
3.筛选
4.文档处理
5.属性
6.css
7.事件
8.效果
9.ajax
10.工具
为了解决多框架冲突:
1.$()
2.jQuery()
当页面加载完毕时
//window.onload
当DOM元素加载完毕时
$(function($) {
// 你可以在这里继续使用$作为别名...
});
而放在body后,本身就是等DOM加载完毕
$("h1:odd") //索引为奇数
$("h1:even") //索引为偶数
data() //藏数据
.clone().appendTo() //不移除
mouseenter([[data],fn]) //鼠标移入
mouseleave([[data],fn]) //鼠标移出
empty() //清空
toggleClass(class) //如果存在(不存在)就删除(添加)一个类
$("<h1>aaaaaaa</h1>").get(0) //aaaaaaa
one(type, [data], fn) //只绑定1次事件
style="opacity:0.1" //调透明度
arr.constuctor //构造器
jquery对象访问:
each()
size()
get()
get(index)
index()
js元素对象和jquery对象之间的转换:
$(document);
$("h3id").get(0);
jQuery(expression, [context]) 返回值:jQuery
$("div > p"); //找到所有 p 元素,并且这些元素都必须是 div 元素的子元素。
$("input:radio", document.forms[0]); //在文档的第一个表单中,查找所有的单选按钮(即: type 值为 radio 的 input 元素)。
$("div", xml.responseXML); //在一个由 AJAX 返回的 XML 文档中,查找所有的 div 元素。
jQuery(html, [ownerDocument]) 返回值:jQuery
$("<div><p>Hello</p></div>").appendTo("body"); //动态创建一个 div 元素(以及其中的所有内容),并将它追加到 body 元素中。
//创建一个 <input> 元素必须同时设定 type 属性。因为微软规定 <input> 元素的 type 只能写一次。
// 在 IE 中无效:
$("<input>").attr("type", "checkbox");
// 在 IE 中有效:
$("<input type='checkbox'>");
jQuery(html, props)
$("<div>", {
"class": "test",
text: "Click me!",
click: function(){
$(this).toggleClass("test");
}
}).appendTo("body"); //动态创建一个 div 元素(以及其中的所有内容),并将它追加到 body 元素中
$("<input>", {
type: "text",
val: "Test",
focusin: function() {
$(this).addClass("active");
},
focusout: function() {
$(this).removeClass("active");
}
}).appendTo("form"); //创建一个 <input> 元素,同时设定 type 属性、属性值,以及一些事件。
jQuery(elements)
$(document.body).css( "background", "black" ); //设置页面背景色。
$(myForm.elements).hide() //隐藏一个表单中所有元素。
jQuery(callback) //$(document).ready()的简写。
$(function(){
// 文档就绪
}); //当DOM加载完成后,执行其中的函数。
jQuery(function($) {
// 你可以在这里继续使用$作为别名...
});
//使用 $(document).ready() 的简写,同时内部的 jQuery 代码依然使用 $ 作为别名,而不管全局的 $ 为何。
each(callback)
$("img").each(function(i){
this.src = "test" + i + ".jpg";
}); //迭代两个图像,并设置它们的 src 属性。注意:此处 this 指代的是 DOM 对象而非 jQuery 对象。
size() //返回值:Number
$("img").size(); //jQuery 对象中元素的个数。这个函数的返回值与 jQuery 对象的'length' 属性一致。
length //返回值:Number
$("img").length; //jQuery 对象中元素的个数。当前匹配的元素个数。 size 将返回相同的值。
selector //返回值:Striing
$("ul").selector //结果ul
context //返回值:Element
$("ul")
.append("<li>" + $("ul").context + "</li>")
.append("<li>" + $("ul", document.body).context.nodeName + "</li>");
//jQuery 1.3新增。返回传给jQuery()的原始的DOM节点内容,即jQuery()的第二个参数。如果没有指定,那么context指向当前的文档(document)。
get() //返回值:Array<Element>
$("img").get().reverse(); //选择文档中所有图像作为元素数组,并用数组内建的 reverse 方法将数组反向
get(index) //返回值:Element $(this).get(0)与$(this)[0]等价。
$("img").get(0);
selector1,selector2,selectorN //返回值:Array<Element(s)>
$("div,span,p.myClass") //找到匹配任意一个类的元素。
强哥jQuery学习笔记的更多相关文章
- 强哥ThinkPHP学习笔记
TP框架:1.模板引擎2.MVC设计模式3.常用操作类 模板引擎和框架区别1.模板引擎只是框架中用来做php和html分离 MVC设计模式M model 数据模型V view 视图C control ...
- 强哥PHP学习笔记
1.php的代码,必须放在.php的文件中,php代码必须写在<?php ?>之间. 2.//单行注释 /* 多行注释 */ 3.默认首页index.php index.html inde ...
- 强哥MySQL学习笔记
数据库服务器:1.数据库2.数据表 数据表:1.表结构(字段)2.表数据(记录)3.表索引(加快检索) 表引擎:1.myisam2.innodb 查看表字段desc table;删除数据库:drop ...
- 强哥memcache学习笔记
搭建memcache服务器:1.在内存中缓存数据2.数据形态以key->value memcache优点:1.快速缓存2.跨域登录memcache缺点:1.复杂的数据存取的操作2.不能永久保存数 ...
- 强哥JavaScript学习笔记
js文件放header头最后,js代码放body体最后 js语言定位: js是基于对象的语言 php.java是面向对象的语言 定义变量: var str="hello world" ...
- 强哥HTML学习笔记
html 浏览器的选择:1.火狐2.ie3.chrome4.mac5.opera 安装两款插件:1.firebug2.web develope html页面元素:1.doctype2.htmlhead ...
- 强哥CSS学习笔记
html嵌套css样式:1.外部(推荐)2.内部3.内联(不推荐) css优先级1.内联2.id选择器3.class选择器4.标签 css长度单位:1.px2.em (14px) css选择器:常用选 ...
- jQuery学习笔记(一)jQuery选择器
目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...
- jQuery 学习笔记
jQuery 学习笔记 一.jQuery概述 宗旨: Write Less, Do More. 基础知识: 1.符号$代替document.getElementById( ...
随机推荐
- " "( 双引号) 与 ' '( 单引号) 差在哪?-- Shell十三问<第四问>
" "( 双引号) 与 ' '( 单引号) 差在哪?-- Shell十三问<第四问> 经过前面两章的学习,应该很清楚当你在 shell prompt 后面敲打键盘.直到 ...
- Python基础(二十):面向对象“类”第三课——类成员
知识点: 类属性与实例属性: 类方法与实例方法: 静态方法: 类属性与实例属性 类属性与实例属性的区别 属性的绑定不同 类属性与当前类相关(绑定的是当前类),与当前类创建的任何对象无关: 实例属性与当 ...
- c 结构体内存对齐详解
0x00简介 首先要知道结构体的对齐规制 1.第一个成员在结构体变量偏移量为0的地址处 2.其他成员变量对齐到某个数字的整数倍的地址处 对齐数=编辑器默认的一个对齐数与该成员大小的较小值 vs中默认的 ...
- 五、python学习-面向对象
1.面对对象程序开发基础(oop) 面对对象:高内聚 低耦合 面向过程: 优点:效率高,执行速度快 缺点:维护性,移植性差,表达不出一类的语义 面向对象: 优点:可读性,可移植性,可维护性高 缺点:执 ...
- Spring 学习笔记(一):Spring 入门
1 Spring简介 Spring是一个轻量级Java开发框架,最早由Rod Johnson创建,目的是为了解决企业级应用开发的业务逻辑层和其他各层的耦合问题,是一个分层的Java SE/EE ful ...
- 强大的工具(一):Capslock+ 3.x版本
1 概述 作者终于把Capslock+更新到了3.x版本了,所以就更了这篇博客. 2.x版本的可以戳这里. 3.x版本与2.x版本的主要不同是更新了新的键盘布局,更加顺手,下面让我们一起来看一下吧. ...
- kube-batch(一)安装
安装 官方:https://github.com/kubernetes-sigs/kube-batch 下载镜像 安装 官方:https://github.com/kubernetes-sigs/ku ...
- Box UVA - 1587
Ivan works at a factory that produces heavy machinery. He has a simple job - he knocks up wooden box ...
- .Net Core 集成 Kafka
最近维护的一个系统并发有点高,所以想引入一个消息队列来进行削峰.考察了一些产品,最终决定使用kafka来当做消息队列.以下是关于kafka的一些知识的整理笔记. kafka kafka 是分布式流式平 ...
- gitlab支持https最简单方法
gitlab支持https方法 使用gitlab内部nginx直接支持https 通过外部nginx代理(本次使用的方法) 访问流程外部nginx--->gitlab的gitlab_workho ...