Js-jquery笔记 jquery有什么用
来源：教师资格 发布时间：2020-03-30 点击：
Js-jquery笔记
变量名的要求：
不能以数字开头
只能包含数字，字母，下划线
不能和系统关键字相同
建议：要把变量名起的有意义一些注意
在JS中所有的符号都必须是英文状态下的
建议每行结束之后加上分号”;”
每行表达清楚意思即可，建议不要都写在一起
区分大小写
数字类型：
Number：数字类型
String，汉字，字母；字符串类型
Null，表示没有空的，空类型
Undefined，表示没有找到；未定义类型
Boolean(bool)True（真的），false（假的），布尔类型
Array,object复杂数据；复合数据类型
js函数：
Typeof(数据) 得到数据的数据类型
Document.write();输出内容到body中，属于文档级别
==：是判断数字是否相同；===：判断的是数字和数据类型
parseInt(numString, [radix])####返回由字符串转换得到的整数
parseFloat:####返回由字符串转换得到的整数
IsFinite：查看是否是无限数
isNaN:判断一个数据是不是数字类型，如果数据不是数字，返回的就是true，如果是数字就是false
js数组
数组.方法名();数组属性使用方式
Length属性####就可以得到数组的个数，arr.length数组的长度
Concat()####返回数组
Poin()####加入字符连接每项返回字符串
Reverse()####反转顺序
pop()####删除最后元素并且返回
Push()####加入新的内容返回长度
Js对象
Var arr=[];var arr=new Array()####js对象创建方式
Array对象
CharAt()####索引位置对应的字符:
charCodeAt()####返回unicode编码a=>97,A=>65
indexOf(“字符”)####查找字符在字符串中出现第一次的位置（下标），找不到就是返回-1
lastIndexOf(“字符”)####查找字符在字符串中出现的最后一次位置（下标）找不到就是返回-1
replace(n1，n2)####替换把n1替换成n2
split(“字符”)####分割字符串为数组
substr(n,m)####截取字符串从n开始截取m个
substring(n,m)####截取字符串从n到m（注意：能截取到n但是不能截取到m）
toLowerCase####转换成小写
toUpperCase####转换成大写
Math对象：
Math.pow(n,m)求n的m次方
Math.abs(n);求n的绝对值
Math.ceil(n)向上取整：找到不小于这个数的最小整数
Math.floor()向下取整：找到不大于这个数的最大整数
Math.round()四舍五入
Math.random()取0到1的随机数,能够取到0但是不可以取到1
Date对象：
Var n1=new Date();//创建当前时间日期对象
Var n2=new Date(“1999/3/9 6:6:6”);new Date(1999,3,9,6,6,6);new Date(349834587347823);创建指定的时间日期对象
Var year=n1.getFullYear();获取年份
Var month=n1.getMonth();获得月份
Var date=n1.getDate();获得日期
Var hours=n1.getHours()获得小时
Var minutes=n1.getMinutes()获得分钟
Var second=n1.getSeconds()获取秒数
Var MilliSeconds=n1.getMilliSeconds()获取毫秒值
Var day=getDay();获取星期
Var time=getTime();//获取毫秒值
Var n=setFullYear();设置年份
Var month=n1.setMonth();设置月份
Var date=n1.set Date();设置日期
Var hours=n1.setHours()设置小时
Var minutes=n1.setMinutes()设置分钟
Var second=n1.setSeconds()设置秒数
Var MilliSeconds=n1.setMilliSeconds()设置毫秒值
document.getElementById(“id名”)，Obj.HTML属性名=值;Obj.style.CSS属性名=”值”;
innerHTML:获取对象中所有的内容（标签和文本）
Document.getElementsByTagName(“标签名”)获得的是数组的形式，如果想要访问某个对象的时候【对象集合[下标]】
Document.links连接获得的是数组的形式，如果想要访问某个对象的时候【对象集合[下标]】
Document.images图片获得的是数组的形式，如果想要访问某个对象的时候【对象集合[下标]】
Document.forms表单对象获得的是数组的形式，如果想要访问某个对象的时候【对象集合[下标]】
Js鼠标事件
Onmouseover####鼠标放上
Onmouseout####鼠标离开
Onclick####点击事件
Ondblclick####双击事件
Onmousedown####鼠标按下
Onmouseu####鼠标抬起
Onmousemov####鼠标移动
键盘事件
Onkeydown:键盘按下
Onkeyup键盘抬起
Onkeypress键盘按键一次
表单事件
Onsubmit：提交事件
Onchange:当发生改变的时候（select）
Onfocus:获得焦点
Onblur:失去焦点
窗口事件：
window.onload=函数名;【写在JS中】
<body onload=”函数名()”></body>当页面加载完成之后立刻执行的事件
Event
Event.clientX鼠标的X坐标
Event.clientY鼠标的Y坐标
Event.target事件发生的源头当事件发生的时候相关信息
JS可以创建出标签
语法：document.createElement(“标签名”)Body：document.body;Document.body.appendChild(obj)
Js中Window的三个弹出窗口
Alert()弹出警告窗口
Prompt()弹出让用户输入的窗口，如果用户输入点击确认可以获得，如果不输入点击确认获得的是空字符串，如果点击取消获得的是null
Confirm()弹出让用户选择的窗口，如果点击确认是true，如果点击取消就是false
Window.open方法
Window.open(url，name,设置)打开新的窗口
Width：窗口的宽度
Height：窗口的高度
Top：离显示器上边的距离
Left：离显示器左边的距离
Scrollbars：滚动条
Toolbar：工具栏
Window.colse();
Js Location跳转
Location.href:获得地址信息
Location.assign(url)加载新的文档
Location.reload();重新加载当前的文档【刷新】
Location.replace()用新的文档替换当前的文档
Replace和assign区别
Replace加载之后没有历史记录
Assign加载之后有历史记录
Js History跳转
History.length：访问过的url的数量
History.back()返回前个页面
History.forward()历史记录的下个页面
History.go()跳转到指定页面，如果参数是-1就是跳转到前个页面
Js Screen 屏幕的宽度
Width:屏幕的宽度
Height：屏幕的高度
availWidth：除去任务栏的宽度
availHeight：除去任务栏的高度
Js Navigator 获取浏览器信息
Navigator.appName：浏览器名称
Navigator.appCodeName：浏览器代码名
Navigator.appversion:浏览器的版本号
Navigator.userAgent:浏览器的信息
DOM中的节点
parentNode：父节点
childNodes子节点：子节点可以有多个【子节点有多个数组】
firstChild第一个子节点
lasetChild最后一个子节点
nextSibling:下一个兄弟节点【同父级的关系】
previousSibling：上一个兄弟节点【同父级的关系】注意：在中空白处都算节点
obj.onclick=函数名;绑定一个onclick事件
要想删除某个元素，必须找到其父节点才可以去删除【只有父节点有权限去删除】
parentNode，在绑定事件中this可以直接使用，对象的父节点.removeChild（对象）
父子关系：
append:$(a).append($b),把b插入 a里面=》a是b的父元素【插入后面】
appendTo(),$(a).appendTo($b),把a插入b中，b是a的父元素【插入后面】
prepend:$(a)prepend($b);把b插入a里面，a是b的父元素【插入前面】
prependTo:$(a).prenpendTo($b)把a插入到b里面，b是a的父元素【插入前面】
兄弟关系：
After$(a).after($b):把b插入到a的后面
Before:$(a).before($b)把b插入到a的前面
insertAfter:$(a).insertAfter($b)把a插入到b的后面
insertBefore$(a).insertBefore($b)把a插入到b的前面
包裹：
Wrap$(a).wrap($b)把a用b包裹起来【没个a都会被b包裹】
wrapAll$(a).wrapAll($(b))把a用b包裹起来【所有的a都一个b包起来】
wrapInner$(a).wrapInner($(b))把a用b包裹起来【把a里面的内容用b包裹起来】
删除：
Empty:内容的删除
remove：标签和内容都删除
克隆：
Clone()
Js动画基本
Show展示
Hide隐藏
Toggle 切换
滑动
slideDown：展开
slideUp收起
slideToggle切换效果
淡入淡出：
FadeIn
Fadeout
FadeToggle
FadeTo
js定时器
创建反复性定时器
Window.setInterVal(“函数()”,时间)=>在每规定的事件内执行一次函数【函数会一直执行】：注意：时间是以毫秒为单位的
停止反复性定时器window.clearInterval(定时器名字)
创建一次性定时器
Window.setTimeout(“函数()”,时间)=>在规定的时间之后会执行函数【函数只会执行一次】：注意：时间是以毫秒为单位的
停止一次性定时器Window.clearTimeout(定时器名)如果定时器没有名字无法停止
js表单按钮
获取单个checkbox选中项(三种写法)
$("input:checkbox:checked").val()
$("input:[type='checkbox']:checked").val();
$("input:[name='ck']:checked").val();
获取多个checkbox选中项
$('input:checkbox').each(function() {if ($(this).attr('checked') ==true) {alert($(this).val());}});
设置第一个checkbox 为选中值
$('input:checkbox:first').attr("checked",'checked');
$('input:checkbox').eq(0).attr("checked",'true');
设置最后一个checkbox为选中值
$('input:radio:last').attr('checked', 'checked');
$('input:radio:last').attr('checked', 'true');
根据索引值设置任意一个checkbox为选中值
$('input:checkbox).eq(索引值).attr('checked', 'true');索引值=0,1,2....
$('input:radio').slice(1,2).attr('checked', 'true');
选中多个checkbox同时选中第1个和第2个的checkbox
$('input:radio').slice(0,2).attr('checked','true');
根据Value值设置checkbox为选中值
$("input:checkbox[value='1']").attr('checked','true');
删除Value=1的checkbox
$("input:checkbox[value='1']").remove();
删除第几个checkbox
$("input:checkbox").eq(索引值).remove();索引值=0,1,2....
如删除第3个checkbox: $("input:checkbox").eq(2).remove();
遍历checkbox
$('input:checkbox').each(function (index, domEle) {//写入代码});
全部选中和全部取消选择
$('input:checkbox').each(function() {$(this).attr('checked', true);});
$('input:checkbox').each(function () {$(this).attr('checked',false);});
提交表单按钮和取消填充
$('#btnSubmit').on('click', function () {$('form').submit();});
$('#btnReset').on('click', function () {$('form')[0].reset();});
获得属性值
$(this).attr('parent_data')
判断是否选中
$(this).attr('checked')
全部选中和全部取消
$(this).siblings('input').attr("checked", true);
$(this).siblings('input').attr("checked", false);
选择第一个
$(this).siblings(":first").attr("checked", true);
推荐访问:笔记 Js jquery