当前位置： 首页 > news >正文

Jquery笔记

news 2026/5/23 9:06:12

DOM对象通过jquery获取

所有的代码都是基于引入jquery.js文件

var mydiv =$('#div');//直接获取到DOM对象元素id
var mydiv=$('.div')；//通过class获取DOM对象，如果有同名class只会获取第一个
var mysapn=$('span');//通过元素的标签名获取DOM对象
var divarr=$('#id,.class,span');//一次获取多个DOM对象
var all=$('*');//通用选择器
var houdai=$('#father div');//获取id为father下面所有的div
var zidai=$('#father>div')获取id为father下面直接的子级div
var xianglinxia=$('.one +img')//选择类名为one的下一个img元素
var tongbei=$('.one~img')//选择类名为one的之后的img元素 只会向下找不会向上找

表单类元素获取方法在这里插入图片描述

DOM操作

1.获取属性

在这里插入图片描述

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><div class="box">1111</div><div id="box1">222</div><input type="checkbox" name="ch" checked="checked" id="aa" abc="aaanncc"><input type="checkbox" name="ch"  id="bb">
</body>
<script src="./jquery-3.7.0.js"></script>
<script>
//操作元素的属性//获取属性 attr('属性名') prop()//固有属性 标签自己带的属性 返回值是boolean的属性  自定义属性：自己定义的属性let ipt1name=$('#aa').attr('name')let ipt1names=$('#aa').prop('name')let ipt1boolean=$('#aa').prop('checked')let ipt1booleans=$('#aa').attr('checked')let ipt2boolean=$('#bb').prop('checked')//undefinedlet ipt2booleans=$('#bb').attr('checked')//falseconsole.log(ipt1name,ipt1names,ipt1boolean,ipt2boolean,ipt2booleans);//设置属性$('#aa').attr('value',1)$('#bb').prop('value',2)
//    $('#bb').attr('checked',false)$('#bb').prop('checked',true);//设置boolean类型的有这个方便//移除属性 $('#aa').removeAttr('checked') 
</script></html>

2.操作元素的样式

在这里插入图片描述

//操作元素的样式 //自己需要写css样式并且class名为sss$('#box1').attr('class','sss')//设置class名$('#box1').addClass('bbb')//追加calss名$('#box1').css('color',"red")//设置单个 $('#box1').css({'color':"red","font-size":'46px'})//设置多个 $('#box1').removeClass('sss')

3.操作元素内容

在这里插入图片描述

   //操作元素的内容$('#box1').html()//获取元素的内容非表单元素$('#box1').html('')//设置元素的内容非表单元素$('#box1').text()//获取元素的纯文本内容非表单元素不识别html元素$('#box1').text('')//设置元素的纯文本内容非表单元素 不识别html元素$('#box1').val()//获取元素的的值 表单元素 $('#box1').val('')//设置元素的的值 表单元素

元素的创建与删除
在这里插入图片描述

  $('<p>这是一个p标签</p>')//创建一个p标签$('#box1').prepend('<p>小奶狗</p>')//在指定元素的内部最前面追加子元素$('<p>小狼狗</p>').prependTo($('#box1'))//在指定元素的内部最前面追加子元素$('#box1').append('<p>小狗</p>')//在指定元素的内部最后面面追加子元素$('<p>小狼狗</p>').appendTo($('#box1'))//在指定元素的内部最后面追加子元素$('#box1').before('<p>狗1</p>')//在指定元素的前面追加元素$('#box1').after('<p>狗2</p>')//在指定元素的后面追加元素$('#box1').after($('.box'))//在指定元素的后面追加元素

在这里插入图片描述

 $('#box3').remove()//删除元素及其子元素标签内容一起删除$('#box4').empty()//只删除内容 很少用

遍历元素在这里插入图片描述

$('#box5').each(function(index,element){//index 下标 element元素console.log(index,element);})

绑定事件

在这里插入图片描述


//绑定事件       这里改相对应的事件 change mouse$('#box4').bind('click',()=>{console.log('111')})

在这里插入图片描述

ajax请求

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

相关文章：

Jquery笔记

DOM对象通过jquery获取 所有的代码都是基于引入jquery.js文件 var mydiv $(#div);//直接获取到DOM对象元素id var mydiv$(.div)&#xff1b;//通过class获取DOM对象&#xff0c;如果有同名class只会获取第一个 var mysapn$(span);//通过元素的标签名获取DOM对象 var divarr$(…...

编程日记 2023/7/31 1:44:24

【C++】优先级队列的基本概念以及其模拟实现

文章目录 补充知识&#xff1a;仿函数一、优先级队列&#xff1a;1.引入2.介绍 二、priority_queue的模拟实现1.大体框架2.私有成员函数&#xff1a;1.向下调整&#xff08;AdjustDown&#xff09;2.向上调整&#xff08;AdjustUp&#xff09; 3.公有成员函数1大小&#xff08;…...

编程日记 2023/7/31 1:43:24

TextClamp for Vue3.0（Vue3.0的文本展开收起组件）

呦&#xff01;大家好&#xff0c;好久没有更新博客了&#xff0c;最近实现了一个一直想自己完成的一个东西&#xff0c;就是文本的展开收起组件&#xff0c;以前项目需要用到&#xff0c;自己实现一个又太繁琐&#xff0c;所以那个时候都是用的别人的轮子&#xff0c;现在自己…...

编程日记 2023/7/31 1:42:22

区间预测 | MATLAB实现VAR向量自回归时间序列区间预测

区间预测 | MATLAB实现VAR向量自回归时间序列区间预测 目录 区间预测 | MATLAB实现VAR向量自回归时间序列区间预测预测效果基本介绍程序设计参考资料预测效果 基本介绍 区间预测 | MATLAB实现VAR向量自回归时间序列区间预测 VAR（Vector Autoregression）模型是一种广泛应用于时…...

编程日记 2023/7/31 1:41:21

在 Windows 上搭建 NTP 服务器

文章目录 一、基础环境二、适用场景三、操作步骤四、常用的NTP服务器五、参考资料 版权声明&#xff1a;本文为博主原创文章&#xff0c;于2023年7月30日首发于CSDN&#xff0c;转载请附上原文出处链接和本声明。本文链接&#xff1a;https://blog.csdn.net/u011046671 一、基础…...

编程日记 2023/7/31 1:40:19

应急响应经典案例-FTP 暴力破解

应急响应经典案例-FTP 暴力破解 应急场景日志分析应急处理措施 应急场景 从昨天开始&#xff0c;网站响应速度变得缓慢&#xff0c;网站服务器登录上去非常卡&#xff0c;重启服务器就能保证一段时间的正常访问&#xff0c;网站响应状态时而飞快时而缓慢&#xff0c;多数时间是…...

编程日记 2023/7/31 1:39:18

41. linux通过yum安装postgresql

文章目录 1.下载安装包2.关闭内置PostgreSQL模块:3.安装postgresql服务:4.初始化postgresql数据库:5.设置开机自启动:6.启动postgresql数据库7.查看postgresql进程8.通过netstat命令或者lsof 监听默认端口54329.使用find命令查找了一下postgresql.conf的配置位置10.修改postgre…...

编程日记 2023/7/31 1:38:17

SpringBoot启动流程及自动配置

SpringBoot启动流程源码&#xff1a; 1、启动SpringBoot启动类SpringbootdemoApplication中的main方法。 SpringBootApplication public class SpringbootdemoApplication {public static void main(String[] args) {SpringApplication.run(SpringbootdemoApplication.class, …...

编程日记 2023/7/31 1:37:16

【Linux】进程轻松入门

目录 一&#xff0c; 冯* 诺依曼体系结构 1&#xff0c;存储结构 ​编辑 二&#xff0c; 操作系统 1&#xff0c;概念 2&#xff0c;设计OS的目的 3&#xff0c;定位 4&#xff0c;如何理解 "管理" 5&#xff0c; 总结 三&#xff0c;进程 1. 概念 那么…...

编程日记 2023/7/31 1:36:14

【使用时空RBF-NN进行非线性系统识别】实现了 RBF、分数 RBF 和时空 RBF 神经网络，用于非线性系统识别研究（Matlab代码实现）

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…...

编程日记 2023/7/31 1:35:13

Tomcat 安装配置教程及成功后，启动失败报错解决方案

解决方案 我的报错原因是因为我的JDK是1.8的而我的Tomcat是10版本的&#xff0c;可能是因为版本原因吧&#xff0c;我重新装了Tomcat 9就可以启动成功了&#xff01; 简单说下安装的时候需要注意哪些步骤吧 今天我在安装tomcat10的时候&#xff0c;安装成功后&#xff0c;启…...

编程日记 2023/7/31 1:34:12

C#文件操作从入门到精通（2）——查看某个dll中有哪些函数

kernel32.dll中含有ini文件操作使用的函数，我们可以通过VisualStudio自带的dumpbin.exe查看dll所包含的函数，操作步骤如下： 1、找到dumpbin.exe所在的文件夹 我的电脑中安装了VisualStudio2019社区版以及VisualStudio2017Professional，但是我发现VisualStudio2019社区版中…...

编程日记 2023/7/31 1:33:11

二分查找算法（全网最详细代码演示）

二分查找也称 半查找&#xff08;Binary Search&#xff09;&#xff0c;它时一种效率较高的查找方法。但是&#xff0c;折半查找要求线性表必须采用顺序存储结构&#xff0c;而且表中元素按关键字 有序 排列。 注意&#xff1a;使用二分查找的前提是 该数组是有序的。 在实际开…...

编程日记 2023/7/31 1:32:10

draw up a plan

爱情是美好的&#xff0c;却不是唯一的。爱情只是属于个人化的感情。 推荐一篇关于爱情的美文&#xff1a; 在一个小镇上&#xff0c;有一家以制作精美巧克力而闻名的手工巧克力店&#xff0c;名叫“甜蜜之爱”。这家巧克力店是由一位名叫艾玛的年轻女性经营的&#xff0c;她对…...

编程日记 2023/7/31 1:31:09

抖音seo源码开发源代码开发技术分享

一、 抖音SEO源码开发&#xff0c;需要掌握以下技术&#xff1a; 抖音API接口&#xff1a;抖音提供了丰富的API接口&#xff0c;包括用户信息、视频信息、评论信息等。 数据爬取技术&#xff1a;通过抓包分析抖音接口的数据结构&#xff0c;可以使用Python等编程语言编写爬虫程…...

编程日记 2023/7/31 1:30:06

QEMU（Quick Emulator）

QEMU&#xff08;Quick Emulator&#xff09;是一款由法布里斯贝拉等人编写的免费的可执行硬件虚拟化的开源托管虚拟机。它可以通过动态的二进制转换模拟CPU&#xff0c;并提供一组设备模型&#xff0c;使它能够运行多种未修改的客户机OS。QEMU还可以为user-level的进程执行CPU…...

编程日记 2023/7/31 1:29:03

Gateway结合nacos（lb://xxx）无效问题

Gateway结合nacos无效 版本如下&#xff1a; com.alibaba.cloud:spring-cloud-starter-alibaba-nacos-discovery:2021.0.1.0 org.springframework.cloud:spring-cloud-starter-gateway:3.1.1 配置如下&#xff1a; server:port: 7000 spring:application:name: springCloudGa…...

编程日记 2023/7/31 1:28:02

NODEJS笔记

全局对象 global/window console.log/info/warn/error/time/timeEnd process.arch/platform/version/env/kill/pid/nextTick Buffer.alloc(5,abcde) String/toString setTimeout/clearTimeout setInterval/clearInterval setImmediate/clearImmediate process.nextTi…...

编程日记 2023/7/31 1:26:59

无涯教程-jQuery - html( )方法函数

html(val)方法获取第一个匹配元素的html内容(innerHTML)。此属性在XML文档上不可用。 html( ) - 语法 selector.html( ) html( ) - 示例 以下是一个简单的示例&#xff0c;简单说明了此方法的用法- <html><head><title>The jQuery Example</title>…...

编程日记 2023/7/31 1:25:58

Linux vsftp三种模式的简单配置部署

环境&#xff1a;Debian 6.1.27-1kali1 (2023-05-12) vsftpd 安装 --查看是否当前系统是否已安装 apt list --installed | grep vsftpd 没有安装的话&#xff0c;就正常安装 apt-get update apt-get install vsftpd 一、匿名用户模式 分享一些不重要文件&#xff0c;任…...

编程日记 2023/7/31 1:24:57

如何用Wand-Enhancer免费解锁WeMod完整功能：3步完整方案指南

如何用Wand-Enhancer免费解锁WeMod完整功能&#xff1a;3步完整方案指南 【免费下载链接】Wand-Enhancer Advanced UX and interoperability extension for Wand (WeMod) app 项目地址: https://gitcode.com/gh_mirrors/we/Wand-Enhancer 还在为WeMod免费版每天2小时的使…...

编程新知 2026/5/23 9:03:31

微信小程序逆向工程终极指南：wxappUnpacker完整实战解析

微信小程序逆向工程终极指南&#xff1a;wxappUnpacker完整实战解析 【免费下载链接】wxappUnpacker forked from https://github.com/qwerty472123/wxappUnpacker 项目地址: https://gitcode.com/gh_mirrors/wxappu/wxappUnpacker 微信小程序逆向工程是安全研究人员和技…...

编程新知 2026/5/23 8:45:58

SQLines 数据库迁移工具深度解析：跨平台SQL转换的技术实现与最佳实践

SQLines 数据库迁移工具深度解析&#xff1a;跨平台SQL转换的技术实现与最佳实践 【免费下载链接】sqlines SQLines Open Source Database Migration Tools 项目地址: https://gitcode.com/gh_mirrors/sq/sqlines 在当今多数据库架构环境中&#xff0c;企业面临着从传统…...

编程新知 2026/5/23 8:30:06

Unity里嵌入一个浏览器？用Embedded Browser插件5分钟搞定H5页面展示与交互

Unity项目快速集成H5页面&#xff1a;Embedded Browser插件实战指南 当Unity项目需要展示动态更新的网页内容时&#xff0c;传统方案往往需要重新开发UI或依赖第三方服务。而Embedded Browser插件提供了一种优雅的解决方案&#xff0c;让开发者能够在Unity中直接嵌入完整的浏览…...

编程新知 2026/5/23 6:07:51

手把手教你把Windows虚拟内存文件pagefile.sys从C盘挪走，给SSD系统盘腾出几十G空间

彻底解放C盘空间&#xff1a;Windows虚拟内存文件迁移全指南 你是否遇到过这样的场景&#xff1a;刚装完系统时C盘还剩下大半空间&#xff0c;用着用着却突然弹出"磁盘空间不足"的警告&#xff1f;打开资源管理器一看&#xff0c;一个名为pagefile.sys的"巨无霸…...

编程新知 2026/5/23 6:07:45

自动驾驶感知中的CFAR：毫米波雷达如何在海量杂波中揪出真实目标？

自动驾驶感知中的CFAR&#xff1a;毫米波雷达如何在海量杂波中揪出真实目标&#xff1f; 当一辆自动驾驶汽车行驶在繁华的城市街道时&#xff0c;它的毫米波雷达每秒会接收到成千上万个反射信号。这些信号中&#xff0c;只有极少数来自真正需要关注的行人、车辆等目标&#xff…...

编程新知 2026/5/23 6:05:41

H3CSE 高性能园区网：生成树保护机制

H3CSE 高性能园区网&#xff1a;生成树保护机制一、生成树保护机制1. BPDU保护1.1 边缘端口特点及问题端口基础特性存在的安全隐患1.2 BPDU保护机制核心防护逻辑机制运行优势1.3 BPDU保护配置配置使用规范H3C设备配置命令2. 根桥保护2.1 根桥保护机制2.2 根桥保护配置要求2.3 根…...

编程新知 2026/5/23 4:14:44

麒麟系统（桌面版）安装 NVIDIA 显卡驱动

麒麟系统&#xff08;桌面版&#xff09;安装 NVIDIA 显卡驱动 一、确认系统和显卡信息 # 查看系统版本 cat /etc/kylin-release# 查看内核版本 uname -r# 查看显卡型号 lspci | grep -i nvidia二、更新系统并安装编译依赖 sudo apt update && sudo apt upgrade -y sud…...

编程新知 2026/5/23 2:52:06

Photoshop‌2022安装教程

ps是一款使用率很高的设计工具&#xff0c;此篇分享一下Windows2022版本的安装教程 1、下载的压缩包解压2、右键以管理员身份运行Set-up.exe3、选择语言及安装位置&#xff08;建议安装在系统盘C以外的其他磁盘&#xff09;4、继续安装&#xff0c;等待安装完成点击关闭即可5、…...

编程新知 2026/5/23 1:34:36

为什么你的Windows快捷键突然失效？Hotkey Detective一键定位占用程序终极指南

为什么你的Windows快捷键突然失效&#xff1f;Hotkey Detective一键定位占用程序终极指南 【免费下载链接】hotkey-detective A small program for investigating stolen key combinations under Windows 7 and later. 项目地址: https://gitcode.com/gh_mirrors/ho/hotkey-d…...

编程新知 2026/5/23 0:42:09