一.什么是jQuery
它是一个轻量级的javascript类库
二.jQuery的优点
(1)兼容浏览器
(2)总是面向集合
(3)多行操作集于一行
三.写jQuery步骤
(1)导入js类库(https://download.youkuaiyun.com/download/qq_40868408/10640172)
(2)jQuery程序入口
$(document).ready(fn);
$(fn);
四.jQuery选择器
作用:找对象
//元素选择器
//属性选择器
//id选择器
//类选择器
//包含选择器
//组合选择器
//自定义选择器
//匹配选择器
$(“tr:even”) //选择tr标签中下标为偶数的对象,从0开始
五. jQuery(html)
html:基于html的一个字符串。
$(function(){
$("#button2"). click(function(){
$("<h1>辉煌</h1>").append("#button2");
});
});
- jQuery属性写法
(1)无参数:
$(“p”).text();
(2)参数val:
$("p").text("Hello world!");
(3)回调函数:
$("p").text(function(n){
return "这个 p 元素的 index 是:" + n;
});
(4)参数
$("img").attr({
src: "test.jpg",
alt: "Test Image"
});
jQuery事件写法:
$("p").click(function(){
$(this).hide();
});
console对象
console.log(“文字”); 输出普通信息
console.dir(); 显示一个对象所有的属性和方法console.dirxml(); 显示网页的某个节点(node)所包含的html/xml代码
属性
$(‘input’).val();//返回该元素的值了
$(‘p’).text();//返回p元素的文本内容。
$(“p”).text(“Hello world!”);//设置所有 p 元素的文本内容
$(“p”).addClass(“selected”);//为匹配的元素加上 ‘selected’ 类
$(“p”).addClass(“selected1 selected2”);
$(“p”).removeClass(“selected”);//从匹配的元素中删除 ‘selected’ 类
$(“p”).toggleClass(“selected”);//为匹配的元素切换 ‘selected’ 类
$(“p”).css(“color”);//取得第一个段落的color样式属性的值。
$(“p”).append(“Hello”);//追加一些HTML标记在p标签后
$(‘li’).first()//获取匹配的第一个元素的li标签
$(‘li’).last()//获取匹配的最后一个元素li标签
大家可以关注下面公众号: 《巧克力酱编程》
有时其他知识会在公众号更新的哦🤞