JavaScript
关注
分享
扫一扫
分享学习笔记
爱学习的啵啵仔
不积跬步无以至千里
展开
-
使用bootstrap制作导航条
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D..原创 2021-02-20 13:04:33 · 648 阅读 · 0 评论 -
王者荣耀手风琴特效
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ pa.原创 2021-02-02 19:44:36 · 491 阅读 · 2 评论 -
购物车页面功能实现
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>购物车---啵啵仔制作</title> <style> *{ .原创 2021-02-02 19:40:18 · 1445 阅读 · 0 评论 -
JS实现拖拽效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box{原创 2021-01-20 19:44:01 · 158 阅读 · 0 评论 -
获取坐标定位
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>坐标定位</title> <style> #one{ widt原创 2021-01-18 18:20:02 · 324 阅读 · 0 评论 -
DIV跟随鼠标移动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>移动盒子</title> <style> #box{ widt原创 2021-01-18 18:19:12 · 114 阅读 · 0 评论 -
DOM修改样式表属性
内联样样式语法语法 元素对象.style.样式名="属性名"；修改样式表样式语法 getComputedStyle(元素对象,null).[样式名];上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2021-01-17 19:18:45 · 194 阅读 · 0 评论 -
JavaScript的简单查询方法
JavaScript详细笔记大全.在document中有一个属性body，它保存的是body的引用var body=document.getElementsByTagName("body")[0]; console.log(body); console.log(document.body);document.documentElement保存html根标签 var html=document.documentElement; console.log(html);document.原创 2020-12-14 17:01:41 · 1106 阅读 · 0 评论 -
JavaScript制作树形菜单
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> ul{ li原创 2020-12-08 11:50:08 · 1306 阅读 · 1 评论 -
JavaScript中DOM
JavaScript详细笔记大全.如果需要读取元素节点属性，直接使用元素．属性名例子:元素.id元素.name元素.value注意:class属性不能采用这种方式，读取class属性时需要使用元素.classNameinnerText-该属性可以获取到元素内部的文本内容-它和innerHTML类似，不同的是它会自动将html去除获取父节点和兄弟节点·通过具体的节点调用parentNode-属性，表示当前节点的父节点previousSibling-属性，表示当前节点的前一个.原创 2020-12-03 19:41:47 · 82 阅读 · 0 评论 -
JavaScript正则表达式语法
JavaScript详细笔记大全.使用字面量来创建正则表达式语法: var变量=/正则表达式/匹配模式使用字面量的方式创建更加简单使用构造函数创建更加灵活 var reg=/a/i; //相当于===var regex = new RegExp("a","i"); console.log(reg.test("ABC"));创建一个正则表达式，检查一个字符串中是否有a或b使用│表示或者的意思 reg=/a|b|C/i;创建一个正则表达式检查一个字符串中是否有字母[]里的内容也.原创 2020-12-03 16:43:44 · 262 阅读 · 0 评论 -
JavaScript字符串和正则表达式相关的方法
JavaScript详细笔记大全.split()-可以将一个字符串拆分为一个数组-方法中可以传递一个正则表达式作为参数，这样方法将会根据正则表达式去拆分字符串这里默认是全局查找console.log(str.split(/[A-z]/));search()-可以搜索字符串中是否含有指定内容-如果搜索到指定内容，则会返回第一次出现的索引，如果没有搜索到返回-1-它可以接受一个正则表达式作为参数，然后会根据正则表达式去检索字符串serach()只会查找第一个，即使设置全局匹配.原创 2020-11-30 20:44:36 · 119 阅读 · 0 评论 -
JavaScript正则表达式使用
JavaScript详细笔记大全.-正则表达式用于定义一些字符串的规则，计算机可以根据正则表达式,来检查一个字符串是否符合规则,获取将字符串中符合规则的内容提取出来语法:var变量=new RegExp(“正则表达式”,“匹配模式”);使用typeof检查正则对象，会返回object var reg = new RegExp("a"); //这个正则表达式可以来检查一个字符串中是否含有a正则表达式的方法:test()-使用这个方法可以用来检查一个字符串是否符合正则表达式的规.原创 2020-11-30 20:41:11 · 117 阅读 · 0 评论 -
JavaScript的String方法
JavaScript详细笔记大全.charAt()-可以返回字符串中指定位置的字符根据索引获取指定的字符var str ="hello word";console.log(str.charAt(0));charCodeAt()-获取指定位置字符的字符编码（Unicode编补)console.log(str.charCodeAt(0));String.formCharcode()-可以根据字符编码去获取字符console.log(String.fromCharCode(65));.转载 2020-11-30 20:31:42 · 165 阅读 · 0 评论 -
JavaScript的包装类
JavaScript详细笔记大全.在JS中为我们提供了三个包装类，通过这三个包装类可以将基本数据类型的数据转换为对象string()-可以将基本数据类型字符串转换为String对象Number()-可以将基本数据类型的数字转换为Number对象Boolean()-可以将基本数据类型的布尔值转换为Boolean对象但是注意:我们在实际应用中不会使用基本数据类型的对象，如果使用基本数据类型的对象，在做一些比较时可能会带来一些不可预期的结果var num =_new Number( 3);var.原创 2020-11-30 20:24:27 · 150 阅读 · 0 评论 -
JavaScript中Math函数的使用
JavaScript详细笔记大全.MathMath和其他的对象不同，它不是一个构造函数，它属于一个工具类不用创建对象，它里边封装了数学运算相关的属性和方法-比如Math.PI 表示的圆周率console.log(Math.PI);用以下属性改变PI就行Math的方法Math.ceil()-可以对一个数进行向上取整，小数位只有有值就自动进Math.floor()-可以对一个数进行向下取整，小数部分会被舍掉Math.round()-可以对一个数进行四舍五入取整|con.原创 2020-11-27 22:46:46 · 604 阅读 · 0 评论 -
JavaScript中Date时间函数使用
JavaScript详细笔记大全.Date对象-在JS中使用Date对象来表示一个时间创建一个Date对象如果直接使用构造函数创建一个Date对象，则会封装为当前代码执行的时间 var d=new Date(); console.log(d);创建一个指定的时间对象需要在构造函数中传递一个表示时间的字符串作为参数日期的格式 月/日/年 时:分:秒 var d2=new Date("5/19/2000 10:10:10"); .原创 2020-11-27 22:38:05 · 307 阅读 · 0 评论 -
JS中concat,join, reverse,sort方法的使用
JavaScript详细笔记大全.concat()可以连接两个或多个数组，并将新的数组返回-该方法不会对原数组产生影响 var arr=["孙悟空","猪八戒","沙和尚"]; var arr2=["鲁兹省","祭祀位","小魔仙"]; var arr3=["二郎神","太上老君","玉皇大帝"] //console.log(arr.concat(arr2)); var result=arr.concat(arr2); .原创 2020-11-27 16:40:38 · 293 阅读 · 0 评论 -
JavaScript数组去重
JavaScript详细笔记大全.<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body&g.原创 2020-11-27 16:23:58 · 144 阅读 · 0 评论 -
JavaScript中call和apply的用法
JavaScript详细笔记大全.cal1()和apply()-这两个方法都是函数对象的方法，需要通过函数对象来调用-当对函数调用call()和apply()都会调用函数执行此时这个对象将会成为函数执行时的thiscall()方法可以将实参在对象之后依次传递apply()方法需要将实参封装到一个数组中统一传递function fun(a,b,c){ console.log("a="+a); console.log("b="+b); console.log("c=.原创 2020-11-27 15:27:55 · 234 阅读 · 0 评论 -
JavaScript中slice和splice的用法
// slice( ) 前开后闭 [);// -可以用来从数组提取指定元素//该方法不会改变元素数组，而是将截取到的元素封装到一个新数组中返回//-参数;// 1.截取开始的位置的索引 [//2.截取结束的位置的索引 )// 索引可以传递一个负值，如果传递一个负值，则从后往前计算// -1倒数第一个// -2倒数第二个 var arr2=arr.slice(0,2) console.log(arr.slice(0,2));console原创 2020-11-26 00:08:16 · 211 阅读 · 3 评论 -
JavaScript的forEach函数用法
一般我们都是使用for循环去遍历数组，S中还为我们提供了一个方法， 用来遍历数组forEach()这个方法只支持IE8以上的浏览器IE8及以下的浏览器均不支持该方法，所以如果需要兼容IE8，则不要使用forEach还是使用for循环来遍历forEach()方法需要一个函数作为参数-像这种函数，由我们创建但是不由我们调用的，我们称为回调函数数组中有几个元素函数就会执行几次，每次执行时，浏览器会将遍历到的元素以实参的形式传递进来,我们可以来定义形参，来读取这些内容|-浏览器会在回调函数中传递原创 2020-11-25 18:56:09 · 1062 阅读 · 0 评论 -
JavaScript数组的遍历
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script>原创 2020-11-25 16:10:53 · 132 阅读 · 0 评论 -
JavaScript个人学习笔记
javas个人学习笔记javaScript函数的定义.javaScript函数的定义.原创 2020-11-25 14:02:22 · 269 阅读 · 0 评论 -
JavaScript中push,pop,unshift,shift方法使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script>原创 2020-11-25 13:58:24 · 197 阅读 · 0 评论 -
JavaScript的数组
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width= , initial-scale=1.0"> <title>Document</title></head><body> <script> 数组(Arr原创 2020-11-25 13:56:44 · 106 阅读 · 0 评论 -
JavaScript的原型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script>原创 2020-11-25 13:54:45 · 157 阅读 · 0 评论 -
javaScript垃圾回收
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script>// 垃圾回收（GC)// -就像人生活的时间长了原创 2020-11-25 13:51:34 · 110 阅读 · 0 评论 -
JavaScript的函数返回值
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script>原创 2020-11-25 13:50:30 · 404 阅读 · 0 评论 -
JavaScript的toString函数
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script&原创 2020-11-25 13:49:48 · 188 阅读 · 0 评论 -
JavaScript的对象
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script>原创 2020-11-25 13:49:04 · 100 阅读 · 0 评论 -
JavaScript中立即执行函数
立即执行函数函数定义完，立即被调用，这种函数叫立即执行函数立即只想函数往往只会执行一次(function(){ alert("hello，word");})();运行效果也可以执行自己参数(function(a,b){ alert(a+b);})(123,456);运行效果...原创 2020-11-21 14:19:35 · 133 阅读 · 0 评论 -
JS实现京东表单注册
首先看下效果图HTML代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>京东</title> <style> *{原创 2020-11-21 09:35:04 · 1229 阅读 · 0 评论 -
JS实现登陆界面
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> input{原创 2020-11-19 19:33:29 · 12089 阅读 · 1 评论 -
javaScript函数的定义
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script&原创 2020-11-18 17:14:15 · 114 阅读 · 0 评论 -
js 2020-11-6
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <!-- <script> window.οnlο原创 2020-11-06 11:45:12 · 118 阅读 · 0 评论