不用jquery用什么 jquery可以直接用吗

转载

网络安全卫士 2023-08-08 11:26:20

文章标签 不用jquery用什么 jquery 前端 javascript 选择器 文章分类 jQuery 前端开发

一，简介

Jquery是一个Js的框架，能够简化Js操作，有着非常多的选择器，能够快速找到需要操作的页面元素

二，Jquery的基本使用方式

①两种方式引入Jquery框架
优点：
下载到本地引用，优点是本地开发时无需连接网络即可使用，不需要担心jQuery被删除
缺点
会导致用户在访问站点时会有大量的jQuery下载请求
②使用CDN，使用其他网站上提供的jQuery(引用)，用户访问站点会去其他网站下载该框架

三，JQuery的两个版本

一般js都会分为开发版（完整），产品版（min版）

开发版：有规范的变量定义和方法定义，以及注释，适合开发时查看和调试源代码，体积比较大
min版：体积较小，是一种混肴的代码版本，代码所有的变量定义及方法定义，都是使用的最简单的字母表示，没有注释，没有换行，大几乎无法调试

四，Jquery的选择器

Jquery的语法：$(内容)
$(document).ready(函数)可以简写为$(函数)

4.1基本选择器

id选择器
$("id")等同于document.getElementById("id")
标签选择器
$("div")等同于document.getElementByTagName("div")
类选择器
$(".class")等同于document.getElementByCassName(".class")
*选择器
$("*")表示获得页面所有元素
selector1,selector2,selector3多种选择器组合
$("div,span,p,myClass")表示得到包含以及span

4.2层级选择器

p空格c：空格表示所有后代的元素
p>c：表示（给定父元素下的）所有的子元素
p+c：表示当前元素后的第一个元素（兄弟）
p-c：表示所有的兄弟元素

4.3常用索引操作选择器

fist第一个元素
last最后一个元素
not（取反）例如：not(first)除了第一个元素
even：得到所有的偶数索引(0,2,4)元素
odd得到所有的奇数索引(1,3,5)元素
eq(index)得到某一个索引元素
gt(index)得到大于某一个索引的所有元素
lt(index)得到小于某一个索引的元素

4.4内容选择器

contains(text)内容包含某种文本元素
empty内容为空的元素
has(selector)内容包含其他选择器元素
parent：包含有内容的选择器
4.5可见性选择器
hidden表示得到隐藏元素
visible表示得到所有可见的元素

4.6属性选择器

[给定的元素]：得到包含给定的元素
[属性名=value]：得到某属性匹配value的元素
[属性名!=value]：得到某种属性不包含value的元素
[属性名^=value]：得到某属性以匹配value开头的元素
[属性名$=value]：得到某属性以匹配value结尾的元素
[属性名*=value]：得到某属性匹配包含value的元素
[属性名][属性名*=]：可以同时使用多个属性选择器

4.7子元素选择器

:first-child得到所有的第一个元素
:last-child得到所有的最后一个元素
:nth-child(index)得到所有的第index号子元素
注意：与前面first last eq的区别
frist得到所有元素的第一个元素，只会得到一个frist-child得到所有第一个元素，会得到满足要求多组元素中的第一个元素

4.8表单选择器

针对表单的选择器
index得到所有的input元素
text得到所有的文本框
pssword得到所有的单选框
radio得到所有的单选框
checkbox得到所有的复选框
submit得到所有的提交按钮
image得到所有的重置按钮
button得到所有的普通按钮
file得到所有的文件域
hidden得到所有的隐藏域
4.9表达对象属性
enable得到所有没有disabled属性的表单元素
disabled得到所有有disabled属性的表单元素
checked得到所有的选中的单选复选框
selected得到所有选择的下拉框

五，属性操作

5.1属性的基本操作

获取属性值