//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方法介绍的更多相关文章

  1. jquery的ajax()函数传值中文乱码解决方法介绍

    jquery的ajax()函数传值中文乱码解决方法介绍,需要的朋友可以参考下 代码如下: $.ajax({ dataType : ‘json', type : ‘POST', url : ‘http: ...

  2. 1.4 jQuery方法,JSON介绍

    jQuery方法: jQuery添加元素: append()方法: $("元素").append("追加内容"); prepend()方法: $("元 ...

  3. UploadifyAPI-上传插件属性和方法介绍

    上一篇文章简单的介绍了Uploadify上传插件的使用.但是对于常用的属性和方法并没有说明.授人以鱼不如授人以渔,我决定将常用的属性列举出来,供大伙参考参考.           Uploadify属 ...

  4. 前端 ----jQuery的介绍

    01-jQuery的介绍   1.为什么要使用jQuery 在用js写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题 ...

  5. jQuery的介绍

    01-jQuery的介绍   1.为什么要使用jQuery 在用js写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题 ...

  6. python 全栈开发,Day53(jQuery的介绍,jQuery的选择器,jQuery动画效果)

    js总结 js: 1.ECMAScript5 ES5语法 2.DOM CRUD 获取 3种方式 id tag className //面向对象 对象 : 属性和方法 某个对象中 function $( ...

  7. [转] HTML5 FormData 方法介绍以及实现文件上传

    XMLHttpRequest 是一个浏览器接口,通过它,我们可以使得 Javascript 进行 HTTP (S) 通信.XMLHttpRequest 在现在浏览器中是一种常用的前后台交互数据的方式. ...

  8. jQuery的介绍和选择器详解

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. jQuery 的介绍 引入 jQuery 的原因 在用 js 写代码时, ...

  9. js与jQuery方法对比

      javascript与jQuery方法对比jquery对象转dom对象 // 方式一(推荐使用) $("input")[0] // 方式二 $("input" ...

随机推荐

  1. Prometheus + Grafana 监控 Redis

    Prometheus安装 .linux-amd64.tar.gz .linux-amd64. cd /prometheus # Start Prometheus. # By default, Prom ...

  2. Python之Web前端Ajax

    Ajax: 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用 一个简单操 ...

  3. 关于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 ...

  4. Hadoop部署(伪分布式系统)

    hadoop安装 #修改主机名 hostnamectl set-hostname hadoop #修改hosts vim /etc/hosts #追加到末尾 10.0.0.11 hadoop 安装必备 ...

  5. 基于 CentOS 7 搭建 GitLab

    ⒈更新软件包 yum update -y ⒉安装 ssh服务并启动 yum install -y curl policycoreutils-python openssh-server systemct ...

  6. Qt5笔记(一)

      1.  只要指定父对象,直接或间接继承于QObect,那么子对象如果是动态分配空间,不需要手动释放内存,系统会自动释放.( Qt的内存回收机制) 2.  想要查看某个函数,可以F1进入帮助文档,连 ...

  7. C语言 --- 初级指针

    1.内存的访问:直接访问,间接访问.     直接访问:int a = 0;直接对a赋值.选一个内存地址,让他存20这个数.                  a += 10;             ...

  8. Linux磁盘挂载、分区、扩容操作

    本文最早发布于 Rootrl's blog 注:以下操作系统环境为CentOS7 基本概念 在操作前,首先要了解一些基本概念 磁盘 在Linux系统中所有的设备都会以文件的形式存储.设备一般保存在/d ...

  9. django 支持跨域请求配置

    参考:https://www.jianshu.com/p/63fb55bee142 核心注意点:

  10. C#面向对象17 23种设计模式

    1.简单工厂模式 using System; using System.Collections.Generic; using System.Linq; using System.Text; using ...