jQuery是JavaScript的方法集,本质是还是js,
用法:首先要在页面的head里引入jQuery文件,引入后就可以在之前写js代码的地方写jQuery了
<script src="js/jquery-3.3.1.min.js"></script>
1.选取元素,基本用法是通过jQuery选择器 $() 来选取jQuery对象,$是选择器标记,括号内填写的是选取的内容
//ID名选择 $("#aa"); //通过ID名选取,取出的是jQuery对象 $("#aa")[0]; //取索引0就可以取到DOM对象 //class名选择 $(".bb"); //通过class名选取,取出的是jQuery对象 $(".bb")[0] //通过索引获取class中第一个元素,获取的是DOM对象 $(".bb").eq(0); //通过eq方法获取class中第一个元素,获取的是jQuery对象 //标签名 $("div"); //通过标签名选取 //属性 $("[name='btn']"); //通过属性选择
2.操作内容,
//非表单元素 var a = $("#aa"); //选取id为aa的非表单元素 a.html(); //操作元素里面的代码 a.append(); //追加,不改变原先内容的情况下添加内容 a.remove(); //移除,可以移除页面上的内容 a.text(); //操作元素里面的文本 //表单元素 var c = $("#cc"); //选取id为cc的表单元素 c.val(); //操作表单元素的value
3.操作属性
//设置属性 a.attr("sx","test"); //设置sx属性值为test //获取属性 a.attr("sx"); //移除属性 a.removeAttr("sx"); // 移除sx属性 //操作单选框和复选框的属性 var d = $("[name='fxk']"); //获取name为fxk元素,为多个复选框 d.prop("checked",true); //设置它们的属性checked为选中状态
4.操作样式,可以操作样式表里的样式
//操作样式 a.css("width","100px"); //设置样式 a.css("width"); //获取样式