强哥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( ...
随机推荐
- .NET 6 Preview 3 发布
前言 2021/4/8 .NET 6 Preview 3 发布,这个版本的改进大多来自于底层,一起来看看都有什么新特性和改进吧. 库改进 新增值类型作为字典值时更快的处理方法 .NET 6 Previ ...
- 通过Dapr实现一个简单的基于.net的微服务电商系统(三)——一步一步教你如何撸Dapr
目录:一.通过Dapr实现一个简单的基于.net的微服务电商系统 二.通过Dapr实现一个简单的基于.net的微服务电商系统(二)--通讯框架讲解 三.通过Dapr实现一个简单的基于.net的微服务电 ...
- Go-30-main包
main包 package main import ( "fmt" "kubeflow-tool/main/cmd" "os" ) func ...
- JVM调优基础到进阶
GC和GC Tuning GC的基础知识 1.什么是垃圾 C语言申请内存:malloc free C++: new delete c/C++ 手动回收内存 Java: new ? 自动内存回收,编程上 ...
- Salesforce学习之路(十)Aura组件工作原理
很喜欢曾经看到的一句话:以输出倒逼输入.以输出的形式强制自己学习,确实是高效的学习方式,真的很棒.以下仅为个人学习理解,如有错误,欢迎指出,共同学习. 1. 什么是Lightning Componen ...
- Springboot+Vue前后端分离的博客项目
项目介绍 演示站(服务器已过期):http://blog.hanzhe.site 开源项目地址 ( 求给个Star ):https://gitee.com/zhang_hanzhe/blog 前端采用 ...
- 【cypress】3. 编写第一个测试
当环境安装好了之后,就可以着手尝试第一个测试的编写了. 一.新建一个文件 在你的项目下的cypress/integration文件夹中创建一个新文件sample_spec.js,我这里直接在webst ...
- 1438. Longest Continuous Subarray With Absolute Diff Less Than or Equal to Limit
Given an array of integers nums and an integer limit, return the size of the longest continuous suba ...
- MYSQL中TIMESTAMP类型的默认值理解
MYSQL中TIMESTAMP类型可以设定默认值,就像其他类型一样. 1.自动UPDATE 和INSERT 到当前的时间:表:----------- Table Create Table ...
- Spring Security 上
Spring Security 上 Security-dome 1.创建项目 创建一个Spring Boot项目,不用加入什么依赖 2.导入依赖 <dependencies> <!- ...