Ctrl+Alt+D+L格式化
//同一个效果 通常采用第二种写法
$(document).ready(function () {
console.log(1);
});
//
$(function () {
console.log(2);
});
//
jQuery(function () {
console.log(3);
});
JQ代码获取的对象都是集合
$(function () {
console.log($("*"));//获取所有对象元素
})
<ul>
<li>1</li>
<li id="li2">2</li>
<li>3</li>
</ul>
<script>
//获取当前元素的子元素 第一个或者最后一个元素
console.log($("ul>li:first"));
console.log($("ul>li:last"));
console.log($("ul>li:last-child"));
console.log($("ul>li:first-child"));
//:not 除了谁 获取其他的
console.log($("ul>li:not(#li2)"));
//奇数获取元素
console.log($("ul>li:even"));
//偶数获取元素
console.log($("ul>li:odd"));
//根据索引获取元素
console.log($("ul>li:eq(0)"));
//lt小于索引值的元素 0 1 2
console.log($("li:lt(1)"));
//gt大于索引值的元素 0 1 2
console.log($("li:gt(1)"));
//获取的ul里面有
console.log($("ul:has(#li2)"));
//获取的元素要有子集 元素或者文本
console.log($("li#li2:parent"));
//属性选择器
console.log($("li[id]"));//具有id这个属性
console.log($("li[id][class]"));//有id和class属性
//根据序号获取元素
console.log($("ul>li:nth-child(3)"));
//更改button中 class为btn 的按钮的显示内rong
$("button.btn").html("html");
$("button.btn").text("html");
$("button.btn").html("<span>html</span>");//显示时不包含span标签
$("button.btn").text("<span>html</span>");//显示出来包含span标签
//获取其中的元素
console.log($("button.btn").html());
//遍历按钮 输出每一个按钮的文本
for (var i=0;i<$("button.btn").length;i++){
console.log($("button.btn").eq(i).html());
}
//获取value值
<input type="text" value="123">
console.log($("input").val());
//设置value值
$("input").val("321");//要带""
//添加类名称
$("input").addClass("txt txt1");
//移除类名称
$("input").removeClass("txt");
//类别的切换 如果有的话删去 没有的话加上
$("input").toggleClass("txt");
//设置id值
$("input").attr("id","user");
//获取id值
console.log($("input").attr("id"));
//自定义属性 data-user=maodou
$("input").attr("data-user","maodou");
//移除
$("input").removeAttr("id");
//一次设置多个属性
$("input").attr({
id:"username",
"data-list":"list",
})
//复选框 后面有checked的显示打勾
<input type="checkbox" checked>篮球
<input type="checkbox">足球
<input type="checkbox">棒球
console.log($("input[type=checkbox]").prop("checked"));
//全部改为true
$("input[type=checkbox]").prop("checked",true);
prop() 方法设置或返回被选元素的属性和值。
siblings() 方法返回被选元素的所有同级元素。
★☆自执行函数
写法①:(函数)(实参)
写法②:(函数(实参))
// 下面2个括弧()都会立即执行
(function () { /* code */ } ()); // 推荐使用这个
(function () { /* code */ })(); // 但是这个也是可以用的