jQuery方法介绍
//jQuery与JavaScript在申明变量的区别:
var $variable = jQuery对象
var variable = DOM对象
$variabl[0] //jQuery对象转换成DOM对象
//拿上面的例子举例,jQuery对象和DOM对象的使用:
$("#i1").html(); //jQuery对象可以使用jQuery的方法
$("#i1")[0].innerHTML; //DOM对象使用DOM的方法
jQuery基础语法
$(selector).action()
基本选择器
语法结构
// $(选择器).action(操作)
$('p') // 标签选择器
$('.c1') // 类选择器
$('#d1') // id选择器
$('p.c1') // 找含有c1样式类的p标签
$('p#d1') // 找含有id是d1的p标签
$('#d1,.c1,div') // 组合选择器
$("x y");// x的所有后代y(子子孙孙)
$("x > y");// x的所有儿子y(儿子)
$("x + y")// 找到所有紧挨在x后面的y
$("x ~ y")// x之后所有的兄弟y
筛选器
下一个元素:
1 $("#id").next(); //筛选出下一个元素
2 $("#id").nextAll(); //筛选出下面所有的元素
3 $("#id").nextUntil("#i2"); //筛选出下面所有的元素,找到ID为i2终止
上一个元素:
$("#id").prev(); //筛选出上一个元素
$("#id").prevAll(); //筛选出上面所有的元素
$("#id").prevUntil("#i2"); //筛选出下面所有的元素,找到id为i2终止
父亲元素:
1 $("#id").parent(); //parent() 方法返回被选元素的直接父元素。
2 $("#id").parentsAll(); //parentsAll()返回被选元素的所有祖先元素
3 $("#id").parentsUntil(); //parentsUntil() 方法返回介于 selector 与 stop 之间的所有祖先元素。
子元素和同级元素:
$("#id").children(); //所有子元素
$("#id").siblings(); //所有同级元素
查找元素:
$("id").find()
1.表单筛选器
js绑定事件的语法
var
xxxEle = document.getElementBy...
xxxEle.on + 事件名 = function()
{
// 事件代码
}
jQuery绑定事件的语法
第一种语法结构:
$(选择器).事件名(function()
{
// 事件代码
})
第二种语法结构 用处更广
$(选择器).on('事件名', function()
{
// 事件代码
})
//实时监测input内部输入变化
$('input').on('input',function () {
// 获取用户输入的内容
console.log($(this).val())
})
// 如何阻止标签后续的事件
// 方式1
// return false
// 方式2
// e.preventDefault()
文档加载
js中
window.onload = function()
{
// 在这里写你的JS代码...
}
jQuery中
$(document).ready(function()
{
// 在这里写你的JS代码...
})
$(function(){
// 你在这里写你的代码
})
上面两种了解即可 我们直接写在body最下方
jQuery方法介绍的更多相关文章
- jquery的ajax()函数传值中文乱码解决方法介绍
jquery的ajax()函数传值中文乱码解决方法介绍,需要的朋友可以参考下 代码如下: $.ajax({ dataType : ‘json', type : ‘POST', url : ‘http: ...
- 1.4 jQuery方法,JSON介绍
jQuery方法: jQuery添加元素: append()方法: $("元素").append("追加内容"); prepend()方法: $("元 ...
- UploadifyAPI-上传插件属性和方法介绍
上一篇文章简单的介绍了Uploadify上传插件的使用.但是对于常用的属性和方法并没有说明.授人以鱼不如授人以渔,我决定将常用的属性列举出来,供大伙参考参考. Uploadify属 ...
- 前端 ----jQuery的介绍
01-jQuery的介绍 1.为什么要使用jQuery 在用js写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题 ...
- jQuery的介绍
01-jQuery的介绍 1.为什么要使用jQuery 在用js写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题 ...
- python 全栈开发,Day53(jQuery的介绍,jQuery的选择器,jQuery动画效果)
js总结 js: 1.ECMAScript5 ES5语法 2.DOM CRUD 获取 3种方式 id tag className //面向对象 对象 : 属性和方法 某个对象中 function $( ...
- [转] HTML5 FormData 方法介绍以及实现文件上传
XMLHttpRequest 是一个浏览器接口,通过它,我们可以使得 Javascript 进行 HTTP (S) 通信.XMLHttpRequest 在现在浏览器中是一种常用的前后台交互数据的方式. ...
- jQuery的介绍和选择器详解
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. jQuery 的介绍 引入 jQuery 的原因 在用 js 写代码时, ...
- js与jQuery方法对比
javascript与jQuery方法对比jquery对象转dom对象 // 方式一(推荐使用) $("input")[0] // 方式二 $("input" ...
随机推荐
- Prometheus + Grafana 监控 Redis
Prometheus安装 .linux-amd64.tar.gz .linux-amd64. cd /prometheus # Start Prometheus. # By default, Prom ...
- Python之Web前端Ajax
Ajax: 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用 一个简单操 ...
- 关于tk.mybatis.spring.mapper.SpringBootBindUtil$SpringBoot2Bind.bind(SpringBootBindUtil.java:129) ~[mapper-spring-boot-autoconfigure-1.2.3.jar:na]的问题
错误如下: java.lang.RuntimeException: java.lang.reflect.InvocationTargetException at tk.mybatis.spring.m ...
- Hadoop部署(伪分布式系统)
hadoop安装 #修改主机名 hostnamectl set-hostname hadoop #修改hosts vim /etc/hosts #追加到末尾 10.0.0.11 hadoop 安装必备 ...
- 基于 CentOS 7 搭建 GitLab
⒈更新软件包 yum update -y ⒉安装 ssh服务并启动 yum install -y curl policycoreutils-python openssh-server systemct ...
- Qt5笔记(一)
1. 只要指定父对象,直接或间接继承于QObect,那么子对象如果是动态分配空间,不需要手动释放内存,系统会自动释放.( Qt的内存回收机制) 2. 想要查看某个函数,可以F1进入帮助文档,连 ...
- C语言 --- 初级指针
1.内存的访问:直接访问,间接访问. 直接访问:int a = 0;直接对a赋值.选一个内存地址,让他存20这个数. a += 10; ...
- Linux磁盘挂载、分区、扩容操作
本文最早发布于 Rootrl's blog 注:以下操作系统环境为CentOS7 基本概念 在操作前,首先要了解一些基本概念 磁盘 在Linux系统中所有的设备都会以文件的形式存储.设备一般保存在/d ...
- django 支持跨域请求配置
参考:https://www.jianshu.com/p/63fb55bee142 核心注意点:
- C#面向对象17 23种设计模式
1.简单工厂模式 using System; using System.Collections.Generic; using System.Linq; using System.Text; using ...