jQuery基础学习 + jQuery AJAX

是在 菜鸟教程 上进行学习的


0.前言

jQuery是一个JavaScript函数库,严格来说jQuery不是个框架,和 vue,react 还是不同的

1. jQuery 安装

通过百度 CDN 引用 jQuery

<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

2. jQuery 语法

jQuery 语法是通过选取 HTML 元素,并对选取的元素执行某些操作。

基础语法: $(selector).action();
  • 美元符号定义 jQuery
  • 选择符(selector)“查询"和"查找” HTML 元素
  • jQuery 的 action() 执行对元素的操作

例子:

  • $(this).hide();- 隐藏当前元素
  • $(“p”).hide(); - 隐藏所有 <p> 元素
  • $(“p.test”).hide(); - 隐藏所有 class=“test” 的 <p> 元素
  • $("#test").hide(); - 隐藏所有 id=“test” 的元素
文档就绪事件

所有 jQuery 函数位于一个 document ready 函数中

$(document).ready(function(){
    //开始写jQuery代码
});

间接写法(常用)

$(function(){
    //开始写jQuery代码
});

jQuery入口函数(上面提到的)和 js 入口函数 window.onload = function(){};的区别
在这里插入图片描述

2.1 jQuery 选择器

大体上和 CSS 选择器差不多的

  • $(“p”) - 选中所有 <p> 元素
  • $("#demo") - 选中所有 id 为 demo 的元素
  • $(".btn") - 选中所有 class 为 btn 的元素
  • $(“p.btn”) - 选中所有 class 为 btn 的 <p> 元素
  • $(“div>p”) - 选中 <div> 的所有子代 <p> 元素
    。。。。。。

一些特殊的

  • $("*") - 选中所有元素
  • $(this) - 选中当前元素
$(function(){
    $("button").click(function(){
         //this就是当前元素即button
         $(this).hide();
    })
});
  • $(“p:first”) - 选取第一个 <p> 元素
  • $(“ul li:first”) - 选取第一个 <ul> 元素的第一个 <li> 元素
  • $(“ul li:first-child”) - 选取每个 <ul> 元素的第一个 <li> 元素
  • $("[href]") - 选取带有 href 属性的元素
  • $(“a[target=’_blank’]”) - 选取所有 target 属性值等于 “_blank” 的 <a> 元素

2.2 jQuery 事件

菜鸟教程jQuery事件


由于自己学 jQuery 主要只是想学 Ajax 而已,所以就学到这些基础部分就 ok 了,具体部分请自行查看 jQuery 菜鸟教程


AJAX — jQuery

语法:

$.ajax();

$(function(){
    $.ajax({
        //请求类型,get或post
        type : "get",
        //请求的url地址
        url : "url",
        //传输的数据,这行不能省略,如果没有数据向后台提交也要写成data:{}的形式
        data : {},
        //传输的数据的类型,一般为json
        dataType : "json",
        //传输成功后执行的函数
        success : function(data){
            //某些操作
        },
        //传输失败后执行的函数
        error : function(data){
            //某些操作
        },
     });
});

原生 js 的 AJAX 方法基础知识

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值