原生js随笔
原生js随笔
JavaScript是一种基于对象和事件驱动的客户端脚本语言
组成: ECMAScript---------------标准语法
Bom(browser Object Model) Dom(document)-------浏览器提供的扩充
API : application programming interface 应用程序接口
js引入,内部和外部,最好都放到body里的
标签前;
外部:-----可维护性高,可缓存的;放在head和body中也可以,但是考虑加载顺序
document.write()方法,将html内容输出到浏览器窗口,所以在document.write()中换行就是
变量:声明一个变量用var来声明 ------var 变量名 = 初始化值;
js 是弱类型语言,定义时不声明变量类型;
js的五种基本数据类型:字符串String,整数Number,布尔型Boolean,null,undefined
从逻辑上看,null值表示一个空对象指针,所以类型是object
变量在定义时可以使用逗号一次性定义多个变量,变量命名也就是标识符的命名规则;
标识符包括变量,函数,属性的名字,最好见名知意,小写字母开头,不能有空格,不能是关键字,不能是保留字,区分大小写;
驼峰命名法
alert() 提示框, document提供的方法,所以换行就是"/n";alert只接收字符串作为参数,自动调用toString()方法转换;
字符串类型的变量定义可以用""也可以用'';
console.log();方法是在控制台输出结果,chrome浏览器的控制台输出,会自动提供换行;
字符串拼接:+
转型函数: 布尔型---Boolean();返回值就是true和false;
字符串返回true ,空串返回false;
数值0返回false ,其他返回true;
null型返回false;undefined返回false ;
float,型由于精度问题,计算不是精确计算,true为1,false为0;
数值型----parseFloat();返回值是浮点型数值;
解析一个字符串,返回一个浮点型数值;
数值型----parseInt();返回值是整型数值,true为1,false为0;
解析一个字符串,返回一个整形的数值;
解析时候,参数如是0开头的数值,会按照8进制转
解析时候,参数如果是0开头的字符串,0就会被忽略;
解析时候,参数如果是ox开头的数值,就会按照16进制进行转换数值;(A~F是10~15);
显示类型转换:
.toString()方法,强制类型转换,转为字符串,对于null和undefined,无法转换,要用String()函数
对象:
Object(),创建一个对象要用new关键字,它是一组数据和功能的集合;创建后可以为它添加属性和方法
算数运算符:
+:只要出现了字符串,就会变成字符串拼接;
- * / %:调用Number()转化;
赋值操作:
就是将右边的值,给 左边的 变量;
简单的赋值操作符: =
复合赋值操作符: += -= *= /= %= (i += 1; 就是 i=i+1);
布尔操作符: ! && ||
逻辑&&: 都真才为真,如果第一个为假,那么就不判断第二个元素,一定是假;
逻辑||:只要一个为真,就为真,第一个为真,就不判断第二个元素,一定为真;
逻辑 !:就是取反
if语句:
if(){}
if(){}else{}
if(){}else if(){} else if(){} else{}
switch case :
switch (条件):
case 0: .....(每一个case后要有break;)
case穿透;
条件可以为true,case中可以写判断式;
关系操作符: > < >= <= 比较规则:
都是字符串就比较字符串编码
一个是数值,另一就会转化为数值
布尔值转换为数值,true为1,false为0;
相等性关系: == 相等 != 不等:
如果比较类型相同:返回值为布尔值,相等返回true,不等返回false
如果比较类型不同:转换后再比较
一个布尔时,布尔转为数值;
一个数值,一个字符串,字符转为数值;
null和undefined是相等的;
null和undefined不转换;
只要有NaN就不等;
全等性关系: ==== 全等 !== 不全等 :
不仅要比较类型,还要比较值;
循环: for(var i = 0; i小于循环条件;i++){
循环体;
} //常用于知道循环次数的循环;
while(循环条件){
循环体;
自增条件;
}//常用于不知道循环次数的循环;
break:跳出整个循环
continue:跳出本次循环,继续程序
死循环: 由于编程错误,使得其自身无法控制终止的程序;
由于需要,希望程序一直执行,当达到某一特定要求才终止循环的情况下;
浏览器调试:(debug) sources 里查看,可以设置断点,想要观察的变量可以右键Add watch,刷新后,点击下一步,一步一步看执行;
函数: 可以重用的代码块(分为自定义函数,内置函数)
函数的声明:function 函数名(参数1,参数2){
函数体;
}
函数可以没有名字,我们称为匿名函数
函数可以没有参数
函数的调用------函数名(实际参数1,实际参数2);
理解参数:函数的参数不介意传进来多少个,也不介意传进来的数据类型,
也就是说定义的时候是要传进来两个参数,但是在调用的时候也未必一定要传进来两个参数,
可以是一个,也可以是三个;参数的内部是直接存在一个数组中的,所以,
我们在访问时,可以通过arguments对象取得传递给函数的每一个参数;
局部变量 和 全局变量:
优先级:局部 大于 全局 ;
如果一个函数内定义一个变量,没有添加var来声明,那么系统自认为这个变量是全局变量;
随机数: function randomNum(min, max){
return Math.floor(Math.random()*(max-min+1)+ min);
}
事件驱动:1获取元素,2绑定事件
事件:onclick 鼠标点击事件
ondblclick 鼠标双击事件
onmouseover 鼠标移入
onmouseout 鼠标移出
onmouseenter
onmouseleave
递归函数:函数通过名字调用自己的情况;
数组: 一组数组的有序列表,每一项可以保存任何类型的数据;
数组的长度是可以动态调整;
数组长度:数组名.length;
创建:var 数组名 = new Array[];
var 数组名 = [];
添加:数组名[位置下标]= "";
数组名.push(a"");从数组的最后一个位置添加元素"a";
数组名.unshift("a");从数组的第一个位置添加元素"a";
数组名.concat(参数1,参数2....)方法;基于当前数组创建一个新数组;
作用是合并,可以合并两个或多个数组,如果是一个值,就会添加到新数组
如果是一个或者多个数组,那么参数数组中的 每一项都会添加到新数组中
删除:数组名.pop(a"");从数组的最后一个位置删除元素"a";
数组名.shift("a");从数组的第一个位置删除元素"a";
转串:数组名.join("")方法就是将数组里的每一项按照字符连接组成一个新的字符串;
排序:数组名.sort()方法;就是数组的排序:
升序:数组名.sort(function(a,b){return a-b;});
降序:数组名.sort(function(a,b){return b-a;});
反序:数组名.reverse()方法;数组反序
查找:数组名.indexOf("a")方法;从数组第一个元素开始查找a,并返回下标值;找不到返回-1;
数组名.indexOf(a,b)方法;从数组的地a+1个元素开始查找b,并返回找到的元素的下小标
数组名.lastIndexOf("a")方法;从数组的最后一个元素查找a,并返回下标值;找不到返回-1;
截取:数组名.slice()方法;截取数组得到一个字数组,接受一个或者两个参数
一个参数就是从参数的位置到最后截取,
两个参数就是从参数1取到参数2,不含参数2;
接受负数参数,负数就是从数组的最后项找位置截取;
数组名.splice()方法;可以实现数组的添加删除和截取;参数接受两个,三个或者多个,接受负数参数;
String对象:是字符串的对象类型,可以用构造函数来创建;
创建:var str = new String("内容");
var str1= "内容"; //基本都这么创建,因为基本类型的字符串也可以用String的方法;
方法:
查找: 字符串.charAt() 方法;返回给定位置的字符;
字符串.charCodeAt()方法;返回给定位置的字符的编码;//与String.fromCharCode()相反的方法;
String.fromCharCode()方法;静态方法,接收字符编码,转成字符串;
字符串.indexOf("a")方法;返回a在字符串中第一次出现的位置下标;如果找不到返回-1;
字符串.lastIndexOf("a")方法;返回a在字符串中最后一次出现的位置下标;如果找不到返回-1;
添加: 字符串.concat("a","b","c".....)方法;不改变原串,生成在原有串上添加的新串;多用于多个字符串的拼接;
加号 + 字符串的拼接 //最长用;
取子串:
字符串.substring(x)方法;截取下标x开始到字符串结尾的子串,不改变原串;
字符串.substring(x,y)方法;截取字符串下标x到y的子串,含x不含y,不改变原串;
字符串.slice(x);截取下标x开始到字符串结尾的子串,不改变原串;
字符串.slice(x,y);截取字符串下标x到y的子串,含x不含y,不改变原串;
字符串.substr(x);截取下标x开始到字符串结尾的子串,不改变原串;
字符串.substr(x,y);截取字符串下标x开始,后面的y个;不改变原串;
去空格:字符串.trim()方法;去掉字符串头和尾的空格;
字符串.trimLeft()方法;去掉字符串最左边的空格;
字符串.trimRight()方法;去掉字符串最右边的空格;
分割:根据分割符将字符串拆分成数组;不改变原串;
字符串.solid("原字符串中有规律的字符"); //找不到 原字符串中有规律的字符 返回1;
大小写转换:
字符串.toLowerCase()方法;转换为小写;
字符串.toUpperCase()方法;转换为大写;
替换:字符串.replace();接受一个或两个参数,一个参数是从下标参数到最后,两个参数是参数2替换参数1字符串;
保留小数位:字符串.toFixed(s);保留小数后s位;
Math对象:该对象的方法都是静态方法,数学公式和信息,与自己编写的方法相比较,Math提供的方法效率更加高;
属性: .PI 就是数学里的圆周率π
方法:Math.random() 随机数0~1
Math.min(x,y);x y 返回最小值;
Math.max(x,y);x y 返回最大值;
Math.ceil(a) ;a向上取整,取最大整数;
Math.round(a);a数学四舍五入取整;
Math.floor(a);a向下取整,取最小整数;//通常考虑到效率问题,用该方法代替parseInt()取整方法;
Math.ads(a);返回a的绝对值;
Math.sqrt(a);a开平方;
Math.pow(a,n);a的n次方;
Date()对象:ECMAScript中的日期是在1970年1月1日午夜零时开始经过的毫秒数保存时间的;
创建:
var 变量名 = new Date(); Date()系统当前时间,在传参时,会自动调用Date类型的toString()方法;
var d = new Date(年,月,日); d Date类型
方法:在方法使用前,都要new一个Date对象,才能使用;
Date对象.getFullYear(); 获得年份;
Date对象.getMonth(); 获得月份;
Date对象.getDate(); 获得日期;
Date对象.getHours(); 获得小时数;
Date对象.getMinutes(); 获得分钟数;
Date对象.getSeconds(); 获得秒数;//一秒 = 1000毫秒;
Date对象.setFullYear();设置年份;
Date对象.setMonth();设置月份;
Date对象.setDay();设置日期;
Date对象.setHours();设置小时数;
Date对象.setMinutes();设置分钟;
Date对象.setSeconds();设置秒数;
Date.now() //当前时间的毫秒数;
Date对象.parse(2016,8,23)//将日期20160823转成距离1970年1月1日的毫秒数;
getTime();获取指定日期的毫秒数
setTime();根据指定毫秒数,设置或者修改日期;
串和数组的转换:
将数组转成字符串:arr.join("符号");//每个字符串之间用符号分隔
将字符串转成数组:str.split("符号");//字符串中以字符规律,分隔成数组元素;
DOM:(document object model)文档对象类型;
注意: 标签.innerHTML =" " ; :写入内容到输出标签内,可以直接写入html标签;
顶层对象:window:
window.screen 屏幕对象
window.location 地址栏对象
window.history 历史记录对象
window.navigator 浏览器对象
方法:
window.alert();//alert();//只接收字符串参数;不是会调用toString()方法;
window.document.write();//输出内容;
window.promet("");//提示输入框
window.confirm();//确认信息框,返回值是布尔类型
if(window.confirm()){
alert("您点击了确定");
}else{
alert("您点击了取消");
}
window.onload = function(){
} //网页加载完成之后执行;
//一般当有要求将js写在head中的时候,就要写这个,避免因加载顺序取不到元素;
定时器:
一次性定时器:
setTimeout(参数1,参数2);//参数1一般是函数,参数2 一般是时间单位毫秒;
setTimeout(function(){
},时间(毫秒));
循环定时器:
setIterval(参数1,参数2);//参数1一般是函数,参数2 一般是间隔执行参1的时间,单位毫秒;
var temer = setInterval(function(){
},间隔时间(毫秒));
为了能够关闭定时器,一般在写定时器的时候都要给定时器的返回值 付给一变量;
定时器的关闭:
cleatInterval(参数);//参数一定是一个定时器的返回值;
焦点事件:
onfocus //得到焦点
onblur //失去焦点
//焦点事件一般就是表单用的比较多:表单元素.onfocus = function(){}
this关键字:触发事件的本身就是this;
//以下对新窗口的操作都要让新窗口获取焦点( onfocus )
window.open(参数1,参数2,参数3);//该方法可以在当前的窗口再打开一个指定大小和位置的新窗口;
//参数1:url 参数2:"窗口名" 参数3:窗口设置的字符串(值对之间逗号分开) ;
window.close() //关闭新窗口;
window.moveTo();//设置新窗口位置;
window.resizeTo(width,height);//设置新窗口宽高;
Location对象:
主机域名:window.location.hostname
当前页面路径:window.location.pathname
完整URL:window.location
方法:assign("url");//传递一个地址,根据地址跳转;
reload() //刷新当前页面;
function reloadPage(){
window.location.reload();
}
roSource(); //表示对象的源代码,通常由JS自动后台调用,不写在代码中(火狐不支持);
属性:location.href = "url";//根据地址跳转;
理解构造函数:
构造函数可以创建指定类型的对象,原生构造函数在运行时会自动出现在运行环境中,
可以创建自定义的构造函数,从而定义对象类型和方法;
构造函数本身也是函数,只是可以用来创造对象;
按照惯例,构造函数始终以大写字母开头;
实例化一个对象时: var 实例化对象 = new 构造函数
Navigator对象:
浏览器名称:
浏览器版本:
操作系统信息:
//以上的基本不用了,最新的浏览器都只要:
navigator.userAgent; //浏览器以及操作系统信息;
//在http协议的头中,也会传该信息;
screen 对象: //显示屏幕
window.screen.width //宽
window.screen.height//高
window.screen.availWidth //可用宽(除去任务栏)
window.screen.availHeight//可用高(除去任务栏)
history对象:
属性:history.length //是0就是新开的一个页面
方法:history.go();//参数是-1 和 1 代表上一页和下一页;
滚动事件 ( onscroll ) :
兼容:
var scrollLeft = document.body.scrollLeft || document.documentElement.scrollLeft;
var sctollTop = document.body.scrollTop || document.documentElement.scrollTop;
DOM中获取元素的方法:
document.getElementById("id名");
document.getElementsByTagName("标签名");//放到数组中
document.getElementsByClassName("class名");//放到数组中
document.getElementsByName("name名");//放到数组中,元素有name属性才可以取
document.querySelector("css选择器");//只要第一个,IE8以下不支持;
document.querySelectorAll("css选择器");// 找到所有,放到数组中,IE8以下不支持;
表达式的优先级:
小括号可以改变优先级
算数(+) > 关系(==) > 逻辑(&&) > 赋值(=);
DOM树:
节点:是包含了标签,注释,文本,doctype等在内的多种组合;
节点的属性:nodeType 节点类型 返回值 : 1 2 3
nodeName 节点名称
nodeValue 节点值
nodeType nodeName nodeValue
元素节点 1 大写元素名(标签名) null或者undefined
属性节点 2 属性值
文本节点 3 #text 文本本身
节点关系:
childNodes :元素的所有子节点(包含空格,回车,tab空白);
children : 元素的所有元素子节点,不包含文本节点;
firstChild : 元素的第一个子节点
lastChild : 元素的最后一个子节点
parentNode: 元素的父亲节点
nextSibling: 元素的下一个兄弟节点
previousSibling:元素的上一个兄弟节点
firstElementChild :元素的第一个子节点
lastElementChild : 元素的最后一个子节点
nextElementSibling:元素的下一个兄弟
previousElementsibling:元素的上一个兄弟
节点操作:
查 :就是获取节点(dom中获取元素的六种方法)
增加:增加分两步,先创建,在加入
创建:createElement("属性名");//创建属性节点
createTextNode("");//创建文本节点
加 :父级元素.appendChild("创");//将创添加到父中;
父级元素.insertBefore("创","节点")//添加到父级的某节点前;
修改:父级.replaceChild("新的","旧的");//父级中旧的被新的替换;
删除:父级.removeChild("节点");//删除父级中的节点
删.remove() //IE不支持;
克隆:节点.cloneNode(true);//克隆后再添加到新的节点中即可;
获得特定元素节点属性的值:
某元素.getAttribute("属性名");//获得末元素的某属性的值---等价:某元素.属性名
设置特定元素节点属性的值:
某元素.setAttribute("属性名","属性值");//设置某元素的某属性和对应的值---等价:某元素.某属性 = 属性值;
删除特定元素节点的属性值:
某元素.removeAttribute("属性名");//删除某元素的某属性;----等价:某元素.某属性 = "";
自定义属性:
自定义属性多用于懒加载图片
按照惯例:data_属性名 = 属性值;
这时只能用Attribute才能取到;
获取非行内样式属性和属性值:
兼容:
if(某元素.currentStyle){
某元素.currentStyle.属性名;
}else{
window.computedStyle("某元素","null").属性名; //没有伪类参数2就是null
}
偏移量:(相对于定位父级的)
offsetWidth: 元素在水平空间上占用的大小(内容+边框+内边距)
offsetHight:元素在垂直空间上占用的大小(内容+边框+内边距)
offsetTop:元素上边界到父级元素上边界
offsetLeft:元素左边界到父级元素左边界
offsetParent:参照物为父级元素
事件:是对用户操作的响应,用于处理表单验证等,事件通常和函数结合使用,函数不会再事件发生前执行;
例如:
用户点击:onclick ondbclick
验证用户输入合法性:onsubmit
窗口滚动:onscroll
页面大小改变:onresize
事件对象:event是事件中的一个隐含元素,可以通过arguments[0]来获取;
在触发一个DOM事件时,就会产生一个event对象,它包含着事件的所有信息,例如鼠标位置,键盘按下等
阻止默认事件(兼容): //例如右键 菜单 (oncontextmenu)
if(event.preventDefault){
event.preventDefault();
}else{
return false;
}
阻止事件冒泡(兼容): //例如右键 菜单 中li的点击和 点击其他地方 ul 消失;
if(event.stopPropagation){
event.stopProragation();
}else{
event.cancelBubble = true;
}
事件绑定:标签直接绑定------< input type="button" οnclick= "func()">
script中:onclick = function(){}
addeEventListener("click",functon(){}, false/true);
第一个参数,事件名没有on,
第二个参数多是函数,如果不是匿名函数,只写函数名,没有小括号,
第三个参数,都false冒泡(冒泡就是从子级元素向父级执行) 都true 捕获(捕获机制就是从父级元素向自己元素执行)
如果多个一个事件绑定多个函数,谁true先执行谁,都true先父级,都false就冒泡;
键盘事件:
获取键盘编码:event.keyCode //每次只能存一个值
onkeydown 键盘按下
onkeypress 键盘一直按着
onkeuup 键盘松开
键盘的组合功能键:
ctrl shift alt 是特殊的按键
按下ctrl event.ctrlKey 返回true;
按下shift event.shiftKey 返回true;
按下alt event.altKey 返回true;
所以组合键的判定:
if(event.keyCode == 按键编码 && event.ctrlKye){}//同事按下Ctrl和一个按键,才会执行;
鼠标事件:
onclick 左键单击
ondbclick 左键双击
oncontextmenu 右键单击
onmousedown 左键按下
onmouseup 左键送开
onmusemove 鼠标移动
onmouseover 鼠标移入
onmouseout 鼠标移出
可以通过event对象,获得鼠标坐标:
event.offsetX //相对于事件源的 对象的偏移量 就是元素相对坐标;
event.offsetY //
event.clientX //可视区的位置 ,就是浏览器坐标
event.clientY //
event.offsetWidth //内容+padding+border(除去margin)
event.offsetHeight//
event.clientWidth //内容+padding
event.clientHeight//
event.screenX //屏幕的坐标 (用的少)
even.screenY //
event.pageX //页面的坐标
event.pageY //
事件监听;addEventListener("dbclick",函数, false);//默认false (冒泡)
捕获机制/冒泡:捕获就是父向子,冒泡就是子向父;
事件委托; 就是利用冒泡机制,将事件添加到父级元素上,然后通过event.target();找到所对应的实际目标对象,提高效率;
cookie:
构成:名称; 值; 域(有默认); 失效时间(有默认); 安全标志(有默认); path(有默认);
写法:分号和空格 分隔每一段cookie;
读写不直观,所以调用cookie,js(自己写的)
工作中的cookie都是规定好后直接拿来用的JS文件;
客户端存储用户信息能力的要求,属于某个特定用户的信息应该存在该用户的机器上,例如登陆信息、偏好设置等等,简单说cookie就是在客户端存储数据的一种选项
兼容整理:
event||window.event(获取event对象,兼容IE老版本)
stopPropagation||cancelBubble = true(阻止事件冒泡,兼容IE老版本)
preventDefault()||return false(阻止默认事件,兼容IE)
window.getComputedStyle("","")||currentStyle(获取非行内样式,兼容IE)
document.documentElement.scrollTop()||document.body.scrollTop(onscroll,兼容的是谷歌)
addeventListener("click",function(){},false/ture)方法||attachEvent("onclick",function(){})(事件监听器的兼容IE写法,执行顺序按照绑定顺序的反序进行执行)
正则:
var reUser = /^[a-zA-Z_]\w{5,14}$/;//用户名
var rePhone = /^1[3,4,5,7,8]\d{9}$/;//手机号
var reIdcard = /^\d{17}(\d|X)$/;//身份证
var reString = /[\u4e00-\u9fa5]+/g;//找中文
var reGang = /(\/{1,})/g;//找 / 或//
转载于:https://www.cnblogs.com/yuejie/p/5979704.html
你可能感兴趣的:(操作系统,javascript)
Vue学习笔记 一
涔溪
vue vue.js 学习 笔记
Vue学习笔记1、Vue基础指令1.1什么是Vue?Vue.js是一套响应式的JavaScript开发库。Vue.js自问世以来所受关注度不断提高,在现在的市场上,Vue.js是非常流行的JavaScript技术开发框架之一。Vue是一款国产前端框架,它的作者尤雨溪(EvanYou)是一位美籍华人,2014年2月,尤雨溪开源了一个前端开发库Vue.js,2015年发布1.0.0版本,2016年4月
cornerstonejs介绍
花花进修
DICOM医学影像查看器 html5 javascript npm yarn
Cornerstone.js是一个用于医疗成像应用程序的开源JavaScript库。它专门设计用于在Web浏览器中处理和显示DICOM(数字成像和通信在医学领域)图像。Cornerstone.js为开发者提供了强大的工具,可以轻松构建功能丰富的医学图像查看器,广泛应用于放射学、病理学、超声成像等领域。特点高性能图像渲染:支持大尺寸医学图像的快速渲染,包括CT扫描、MRI、X光片等。利用GPU加速(
Java整体基础知识体系图
神州永泰
java 编程语言 大数据 java spring mysql
一java介绍Java是一种高级编程语言,由SunMicrosystems公司于1995年推出。Java具有跨平台性、面向对象、健壮性、安全性、可移植性等特点,被广泛应用于企业级应用开发、移动应用开发、大数据处理、云计算等领域。Java程序可以在不同的操作系统上运行,只需编译一次,就可以在任何支持Java虚拟机(JVM)的平台上运行,这得益于Java的“一次编写,随处运行”的特性。Java是面
Ubuntu 16.04下Firefox版本更新详解
何遇mirror
前端 firefox
目录引言更新至最新稳定版本检查Firefox版本设置手动更新选项安装特定版本注意事项引言Ubuntu16.04LTS(长期支持版)虽然曾经是一个非常稳定的发行版,但其官方支持已在2021年4月结束。尽管如此,仍有一些用户出于各种原因继续使用该版本的操作系统。对于这些用户而言,确保安装在其系统上的软件能够及时更新是非常重要的,尤其是像Firefox这样的常用网络浏览器。本文将详细介绍如何在Ubunt
javascript模板
wanggs
模板DocumentClick{{title}}{{content}}$(function(){$("#btn").click(function(){varhtml=$("#template").html();html=html.replace("{{id}}",Math.random());html=html.replace("{{title}}","Hello,"+newDate().getT
Ubuntu 16.04系统下更新Firefox浏览器
jun778895
ubuntu firefox 腾讯云
在Ubuntu16.04系统下更新Firefox浏览器到最新版本是一个相对直接但需要注意细节的过程。由于Ubuntu16.04是一个较旧的操作系统版本,其默认的软件包管理器apt可能无法提供最新版本的Firefox。因此,用户通常需要手动下载Firefox的最新版本并进行安装。以下是一个详细的步骤指南,帮助您在Ubuntu16.04系统下更新Firefox浏览器。一、准备工作备份当前Firefox
javascript网页设计案例
Min_nna
js jquery功能 ai分析 javascript
以下是一些使用JavaScript进行网页设计的案例,这些案例展示了JavaScript在前端开发中的强大功能和灵活性。每个案例都包含了基本的实现思路和代码示例。图片画廊(ImageGallery)功能:展示一组图片,并支持点击放大查看。实现思路:使用HTML和CSS创建图片网格。使用JavaScript处理图片点击事件,显示放大的图片。代码示例:ImageGallery×consti
iOS之运行时机制(三)
奋拓达
前言Objective-C语言是一门动态语言,它将很多静态语言在编译和链接时期做的事放到了运行时来处理。这种动态语言的优势在于:我们写代码时更具灵活性,如我们可以把消息转发给我们想要的对象,或者随意交换一个方法的实现等这种特性意味着Objective-C不仅需要一个编译器,还需要一个运行时系统来执行编译的代码。对于Objective-C来说,这个运行时系统就像一个操作系统一样:它让所有的工作可以正
Nginx部署前端Vue项目
hai40587
前端 nginx vue.js
在使用Nginx部署前端Vue项目时,我们主要关注的是如何高效地将静态资源(HTML、CSS、JavaScript、图片等)提供给客户端浏览器。Vue.js是一个流行的JavaScript框架,用于构建用户界面,而Nginx作为一个高性能的HTTP和反向代理服务器,非常适合用于静态资源的托管。以下将详细介绍如何使用Nginx部署Vue项目,包括环境准备、Vue项目构建、Nginx配置、部署过程以及
使用 Nginx 部署前端 Vue 项目
vvvae1234
前端
在这篇文章中,我们将深入探讨如何使用Nginx部署一个Vue.js前端项目。Vue是一个流行的前端JavaScript框架,而Nginx则是一个性能卓越的Web服务器和反向代理服务器。通过将这两者结合起来,我们可以高效地托管我们的前端应用。一、环境准备在开始部署之前,我们需要确保我们的环境中已安装以下软件:Node.js和npm:用于构建Vue项目。VueCLI:用于快速创建Vue项目。Nginx
在Ubuntu/Debian Linux系统上检查已经安装软件包的版本
welson_ll
linux
如果要在Ubuntu/DebianLinux操作系统上检查已经安装软件包的版本(知道Ubuntu/Debian系统上可用的软件包版本),可使用apt、apt-cache、aptitude和apt-show-versions命令。前言在Linux中,所有应用程序均以程序包的形式分发,无非就是与程序包管理系统关联的文件。本文将向您展示一些命令,这些命令可用于检查Ubuntu/DebianLinux机器
使用Nginx部署前端Vue项目
bigbig猩猩
前端 nginx vue.js
在使用Nginx部署前端Vue项目时,我们主要关注的是如何高效地将静态资源(HTML、CSS、JavaScript、图片等)提供给客户端浏览器。Vue.js是一个流行的JavaScript框架,用于构建用户界面,而Nginx作为一个高性能的HTTP和反向代理服务器,非常适合用于静态资源的托管。以下将详细介绍如何使用Nginx部署Vue项目,包括环境准备、Vue项目构建、Nginx配置、部署过程以及
网络基础Linux 常用Ping命令详解
思静语
Linux&运维安装 网络通信 网络 linux
文章目录Linux常用ping命令详解ping用法1.在Windows操作系统下:2.在Unix/Linux和macOS操作系统下:ping命令参数ping的原理是什么ping和ICMP的关系网络基础Ping命令详解(使用Ping这命令来测试网络连通)Linux常用ping命令详解概述不管在windows平台,还是在linux平台,ping都是非常常用的网络命令;ping命令通过ICMP(Inte
Easyui Datagrid实现行操作
天农学子
easyui 前端 javascript
EasyuiDatagrid实现行操作效果分析实现此功能需要实现2点1、首列的内容全部需要渲染成申请开票2、点击申请开票可以获获取到指定的行内容,在执行后续操作实现方案1、首行格式化,在table的th属性中加入formatter示例代码如下操作2、在JavaScript中编写代码formatOperatefunctionformatOperate(val,row){return'申请开票';}当
Windows实用技巧:全面解析与解决任务管理器显示不全的问题
DTcode7
IT信息技术相关 # 信息化技能面试宝典 技术常识 前端 面试宝典 IT信息化 网络
Windows实用技巧:全面解析与解决任务管理器显示不全的问题基本概念与问题背景任务管理器简介显示不全现象解决方案实战示例1:调整显示设置示例2:重置任务管理器设置示例3:系统还原与更新示例4:禁用可能导致冲突的软件示例5:注册表编辑(高级操作)实践技巧与注意事项遇到问题的排查思路结语与讨论在Windows操作系统中,任务管理器是每位IT专业人士不可或缺的瑞士军刀,它提供了系统性能监视、进程管理乃
服务器上部署服务
wq_151
人工智能 问题解决办法 计算机通识 服务器 运维
服务器上部署服务用户:在服务器上部署服务,如一个可登录的网站、可登录的云盘和支持语言切换的个人博客等网页等,需要那些工作和软件配置,他们分别起到的作用是什么?ChatGPT:在服务器上部署一个服务,如一个可登录的网站、可登录的云盘,或者支持语言切换的个人博客等,通常涉及以下几个工作步骤和软件配置。每个步骤及软件配置的作用如下:选择服务器和操作系统服务器:通常可以选择云服务器(如AWS,Alibab
操作系统与网络协议晦涩难懂,华为18级工程师神级文档助你过关
ZZ100861122
操作系统所见的是暂时的,所不见的是永远的。当你在电脑上玩游戏、与朋友聊天或编写一个程序并加载运行的时候,你有没有一种像在观看魔术的感觉?编写好的程序能够编译运行,计算出结果,并显示或打印出来。你有没有觉得它很神秘?如果想揭开这层神秘的面纱,你就得学习操作系统。因为操作系统是掌控计算机运行的系统,在学习它的过程中,读者能够了解程序在计算机上运行的全景,或者说我们所认为的全景。之所以这么说,是因为精确
鸿蒙系列一:启动流程
与米同乐
HarmonyOS
引导程序 有过电脑系统装机经历的人都知道BIOS的概念,为Android手机刷机过的小伙伴都听过Bootloader,那这些概念和手机启动有什么关系呢? 首先,无论是电脑还是手机,操作系统都不是开机就直接启动的,都是通过引导程序来帮助启动操作系统的,对于电脑来说BIOS起到了这个功能,对于手机则是Bootloader来担此重任。可能有些人会有疑问,电脑和手机的开机为什么不直接启动操作系统,而是
iniparser 使用方法介绍
kunsir_
iniparser linux 嵌入式
一、iniparser的概述INI(InitializationFile)文件是一种简单直观的数据存储格式,常用于配置应用程序的初始化设置。这种文件通常包含若干个节(section)和键值对(key-valuepairs)。INI文件的每一部分都是自描述性的,易于阅读和编辑,使得非程序员也能轻易理解并修改配置参数。INI文件因其简单易用性而在许多编程语言中广泛应用,尤其是在Windows操作系统中
UNIX 文件操作,快速的把数据写入SD卡上
kunsir_
linux arm开发 嵌入式
如果在程序中打开了文件但没有在使用完毕后关闭它,会导致一些潜在的问题,具体取决于操作系统和文件系统的行为,以及程序的执行情况。以下是可能的后果:资源泄漏:每个打开的文件都会占用系统资源,如文件描述符。如果程序频繁地打开文件但不关闭,会导致系统资源的耗尽,从而影响其他进程的正常运行。文件系统资源耗尽:某些文件系统可能对同时打开的文件数量有限制。如果程序打开了大量文件但不关闭,可能会导致文件系统资源的
html语言及js脚本基础,Javascript基础学习笔记(菜鸟必看篇)
游苏昱
html语言及js脚本基础
什么是变量?变量是用于存储信息的容器变量的声明语法:var变量名变量名=值;变量要先声明再赋值变量可以重复赋值变量的命名规则变量必须以字母开头;变量也能以$和_符号开头(不过我们不推荐这么做);变量名称对大小写敏感(a和A是不同的变量)。语句语句以一个分号结尾;如果省略分号,则由解析器确定语句的结尾。有个好的编码习惯,都要以;结尾数据类型在JavaScript中,一段信息就是一个值(value)。
DBeaver 24.1.4版本发布,原生支持GaussDB!
Frank Cao
gaussdb
摘要:欢迎大家下载并体验DBeaver24.1.4版本,探索GaussDB的无限可能本文分享自华为云社区《DBeaver24.1.4版本发布,原生支持GaussDB!》,作者:GaussDB数据库。华为云GaussDB一直致力于完善生态体系的构建,为用户提供最佳的使用体验。DBeaver作为一款开源的数据库管理软件,因其广泛的数据库兼容、丰富的功能特性以及多操作系统支持,成为了众多数据库开发者的首
《财富自由之路》7.29
冰月清秋
12.为了不断升级操作系统,你最需要具备什么能力?元认知能力。元认知能力是一切学习与进步的最底层和最根本的能力。如何获得元认知能力:学习和坐享。13.你的人生中最沉重的枷锁是什么?时刻关注身边所有可以被关注的东西,追求百分之百的安全感,被困在永恒的当下。我的理解是:我们每个人精力有限,如果关注身边所有事,势必分散精力,无法专注于一件事,若要专注一件事,必然会放弃一些其他事情,也就是作者说的,勇于放
菜鸟笔记-001 如何用JavaScript脚本在文字中实现向左或向右插入空格
胤祥矢量商铺
菜鸟学习笔记 笔记 illustrator javascript 文字操作
这是一个网友在线上问我的一个问题:如何用JavaScript脚本在文字中实现向左或向右插入空格下图是在文字左边插入了1/2个空格的效果:那么如何用javascript实现向左向右插入空格?其实这个功能,我在实际工作确实很少碰到,我只有祭出宝典查阅-IllustratorJavaScriptScriptingReference2022.pdf,当然你有更新版的更好。查到文字的向左插入空格或向左插入空
this 关键字的绑定类型
浮游本尊
前端
在JavaScript中,理解this关键字的指向对于编写高质量的代码至关重要。this的指向取决于函数的调用方式,而不是定义方式。以下是几种常见的this绑定情形及其工作原理的解析。全局上下文中的this当在全局作用域中使用this或者函数在全局作用域被调用时,this通常指向全局对象。在Web浏览器中,这个全局对象是window,而在Node.js环境中则是global对象。functionc
Linux下TCP编程
AI+程序员在路上
嵌入式软件开发 linux系列 linux tcp/ip c语言 开发语言
一.概念介绍1.socket是什么?socket(套接字)本质上是一个抽象的概念,它是一组用于网络通信的API,提供了一种统一的接口,使得应用程序可以通过网络进行通信。在不同的操作系统中,socket的实现方式可能不同,但它们都遵循相同的规范和协议,可以实现跨平台的网络通信。2.socket实现通信的原理是基于网络协议栈。协议栈是一个由多个层次协议组成的网络协议体系结构,它负责对数据进行封装和解封
lwip协议的配置与裁剪
空气中的告白
网络
1、前言最近项目的上使用有线以太网功能,软件协议使用LWIP协议,操作系统使用Rtthread3.1.3版本,硬件使用STM32F429+PHYLAN8720方式。这篇记录总结lwip的详细配置。2、配置文件种类lwip的配置文件有lwipopts.h和opt.h两个头文件,其他中opt.h文件是lwip的默认配置文件,不需要修改此文件,lwipopts.h是用于配置lwip的文件,用户的对协议的
JavaScript 模块化开发:ES6 模块与 CommonJS 的对比与应用
程序员小羊!
Java javascript es6 开发语言
您好,我是程序员小羊!前言随着前端项目规模的增长,代码组织和管理变得越来越复杂。模块化开发成为解决这一问题的有效手段,能够帮助开发者将代码进行分割、复用和维护。JavaScript在发展过程中出现了多种模块化规范,其中最为广泛使用的有ES6模块(也称为ESModules)和CommonJS模块规范。本文将从原理、语法、应用场景和两者对比等多个方面深入探讨这两种模块化规范,帮助开发者更好地理解和应用
每天学一个电脑知识day1:盘符是什么?
Emma想做技术大佬
每天学一个电脑知识 电脑
在计算机中,盘符是用来标识和访问存储设备的一个符号或名称。它常用于操作系统中,用于表示硬盘驱动器、光盘驱动器、USB驱动器等存储设备的逻辑标识符。在Windows操作系统中,盘符通常以一个字母加上一个冒号来表示,如C:、D:等。每个盘符代表一个独立的存储空间,可以用来存储和组织文件和数据。
【js逆向专题】4.python调用JS和扣代码
Regent Wan
js逆向 javascript js逆向
小节目标:掌握python调用js代码方式熟悉js开放接口进行调用了解补环境的基本概念掌握js调试技巧一.pyexecjs的使用1.简介PyExecJS是一个Python库,用于在Python环境中执行JavaScript代码。它实际上是对ExecJS库的Python封装,ExecJS本身是一个通用的JavaScript运行环境的抽象层。使用PyExecJS,你可以在Python中执行JavaSc
JAVA基础
灵静志远
位运算 加载 Date 字符串池 覆盖
一、类的初始化顺序
1 (静态变量,静态代码块)-->(变量,初始化块)--> 构造器
同一括号里的,根据它们在程序中的顺序来决定。上面所述是同一类中。如果是继承的情况,那就在父类到子类交替初始化。
二、String
1 String a = "abc";
JAVA虚拟机首先在字符串池中查找是否已经存在了值为"abc"的对象,根
keepalived实现redis主从高可用
bylijinnan
redis
方案说明
两台机器(称为A和B),以统一的VIP对外提供服务
1.正常情况下,A和B都启动,B会把A的数据同步过来(B is slave of A)
2.当A挂了后,VIP漂移到B;B的keepalived 通知redis 执行:slaveof no one,由B提供服务
3.当A起来后,VIP不切换,仍在B上面;而A的keepalived 通知redis 执行slaveof B,开始
java文件操作大全
0624chenhong
java
最近在博客园看到一篇比较全面的文件操作文章,转过来留着。
http://www.cnblogs.com/zhuocheng/archive/2011/12/12/2285290.html
转自http://blog.sina.com.cn/s/blog_4a9f789a0100ik3p.html
一.获得控制台用户输入的信息
&nbs
android学习任务
不懂事的小屁孩
工作
任务
完成情况 搞清楚带箭头的pupupwindows和不带的使用 已完成 熟练使用pupupwindows和alertdialog,并搞清楚两者的区别 已完成 熟练使用android的线程handler,并敲示例代码 进行中 了解游戏2048的流程,并完成其代码工作 进行中-差几个actionbar 研究一下android的动画效果,写一个实例 已完成 复习fragem
zoom.js
换个号韩国红果果
oom
它的基于bootstrap 的
https://raw.github.com/twbs/bootstrap/master/js/transition.js transition.js模块引用顺序
<link rel="stylesheet" href="style/zoom.css">
<script src=&q
详解Oracle云操作系统Solaris 11.2
蓝儿唯美
Solaris
当Oracle发布Solaris 11时,它将自己的操作系统称为第一个面向云的操作系统。Oracle在发布Solaris 11.2时继续它以云为中心的基调。但是,这些说法没有告诉我们为什么Solaris是配得上云的。幸好,我们不需要等太久。Solaris11.2有4个重要的技术可以在一个有效的云实现中发挥重要作用:OpenStack、内核域、统一存档(UA)和弹性虚拟交换(EVS)。
spring学习——springmvc(一)
a-john
springMVC
Spring MVC基于模型-视图-控制器(Model-View-Controller,MVC)实现,能够帮助我们构建像Spring框架那样灵活和松耦合的Web应用程序。
1,跟踪Spring MVC的请求
请求的第一站是Spring的DispatcherServlet。与大多数基于Java的Web框架一样,Spring MVC所有的请求都会通过一个前端控制器Servlet。前
hdu4342 History repeat itself-------多校联合五
aijuans
数论
水题就不多说什么了。
#include<iostream>#include<cstdlib>#include<stdio.h>#define ll __int64using namespace std;int main(){ int t; ll n; scanf("%d",&t); while(t--)
EJB和javabean的区别
asia007
bean ejb
EJB不是一般的JavaBean,EJB是企业级JavaBean,EJB一共分为3种,实体Bean,消息Bean,会话Bean,书写EJB是需要遵循一定的规范的,具体规范你可以参考相关的资料.另外,要运行EJB,你需要相应的EJB容器,比如Weblogic,Jboss等,而JavaBean不需要,只需要安装Tomcat就可以了
1.EJB用于服务端应用开发, 而JavaBeans
Struts的action和Result总结
百合不是茶
struts Action配置 Result配置
一:Action的配置详解:
下面是一个Struts中一个空的Struts.xml的配置文件
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
&quo
如何带好自已的团队
bijian1013
项目管理 团队管理 团队
在网上看到博客"
怎么才能让团队成员好好干活"的评论,觉得写的比较好。 原文如下: 我做团队管理有几年了吧,我和你分享一下我认为带好团队的几点:
1.诚信
对团队内成员,无论是技术研究、交流、问题探讨,要尽可能的保持一种诚信的态度,用心去做好,你的团队会感觉得到。 2.努力提
Java代码混淆工具
sunjing
ProGuard
Open Source Obfuscators
ProGuard
http://java-source.net/open-source/obfuscators/proguardProGuard is a free Java class file shrinker and obfuscator. It can detect and remove unused classes, fields, m
【Redis三】基于Redis sentinel的自动failover主从复制
bit1129
redis
在第二篇中使用2.8.17搭建了主从复制,但是它存在Master单点问题,为了解决这个问题,Redis从2.6开始引入sentinel,用于监控和管理Redis的主从复制环境,进行自动failover,即Master挂了后,sentinel自动从从服务器选出一个Master使主从复制集群仍然可以工作,如果Master醒来再次加入集群,只能以从服务器的形式工作。
什么是Sentine
使用代理实现Hibernate Dao层自动事务
白糖_
DAO spring AOP 框架 Hibernate
都说spring利用AOP实现自动事务处理机制非常好,但在只有hibernate这个框架情况下,我们开启session、管理事务就往往很麻烦。
public void save(Object obj){
Session session = this.getSession();
Transaction tran = session.beginTransaction();
try
maven3实战读书笔记
braveCS
maven3
Maven简介
是什么?
Is a software project management and comprehension tool.项目管理工具
是基于POM概念(工程对象模型)
[设计重复、编码重复、文档重复、构建重复,maven最大化消除了构建的重复]
[与XP:简单、交流与反馈;测试驱动开发、十分钟构建、持续集成、富有信息的工作区]
功能:
编程之美-子数组的最大乘积
bylijinnan
编程之美
public class MaxProduct {
/**
* 编程之美 子数组的最大乘积
* 题目: 给定一个长度为N的整数数组,只允许使用乘法,不能用除法,计算任意N-1个数的组合中乘积中最大的一组,并写出算法的时间复杂度。
* 以下程序对应书上两种方法,求得“乘积中最大的一组”的乘积——都是有溢出的可能的。
* 但按题目的意思,是要求得这个子数组,而不
读书笔记-2
chengxuyuancsdn
读书笔记
1、反射
2、oracle年-月-日 时-分-秒
3、oracle创建有参、无参函数
4、oracle行转列
5、Struts2拦截器
6、Filter过滤器(web.xml)
1、反射
(1)检查类的结构
在java.lang.reflect包里有3个类Field,Method,Constructor分别用于描述类的域、方法和构造器。
2、oracle年月日时分秒
s
[求学与房地产]慎重选择IT培训学校
comsci
it
关于培训学校的教学和教师的问题,我们就不讨论了,我主要关心的是这个问题
培训学校的教学楼和宿舍的环境和稳定性问题
我们大家都知道,房子是一个比较昂贵的东西,特别是那种能够当教室的房子...
&nb
RMAN配置中通道(CHANNEL)相关参数 PARALLELISM 、FILESPERSET的关系
daizj
oracle rman filesperset PARALLELISM
RMAN配置中通道(CHANNEL)相关参数 PARALLELISM 、FILESPERSET的关系 转
PARALLELISM ---
我们还可以通过parallelism参数来指定同时"自动"创建多少个通道:
RMAN > configure device type disk parallelism 3 ;
表示启动三个通道,可以加快备份恢复的速度。
简单排序:冒泡排序
dieslrae
冒泡排序
public void bubbleSort(int[] array){
for(int i=1;i<array.length;i++){
for(int k=0;k<array.length-i;k++){
if(array[k] > array[k+1]){
初二上学期难记单词三
dcj3sjt126com
sciet
concert 音乐会
tonight 今晚
famous 有名的;著名的
song 歌曲
thousand 千
accident 事故;灾难
careless 粗心的,大意的
break 折断;断裂;破碎
heart 心(脏)
happen 偶尔发生,碰巧
tourist 旅游者;观光者
science (自然)科学
marry 结婚
subject 题目;
I.安装Memcahce 1. 安装依赖包libevent Memcache需要安装libevent,所以安装前可能需要执行 Shell代码 收藏代码
dcj3sjt126com
redis
wget http://download.redis.io/redis-stable.tar.gz
tar xvzf redis-stable.tar.gz
cd redis-stable
make
前面3步应该没有问题,主要的问题是执行make的时候,出现了异常。
异常一:
make[2]: cc: Command not found
异常原因:没有安装g
并发容器
shuizhaosi888
并发容器
通过并发容器来改善同步容器的性能,同步容器将所有对容器状态的访问都串行化,来实现线程安全,这种方式严重降低并发性,当多个线程访问时,吞吐量严重降低。
并发容器ConcurrentHashMap
替代同步基于散列的Map,通过Lock控制。
&nb
Spring Security(12)——Remember-Me功能
234390216
Spring Security Remember Me 记住我
Remember-Me功能
目录
1.1 概述
1.2 基于简单加密token的方法
1.3 基于持久化token的方法
1.4 Remember-Me相关接口和实现
位运算
焦志广
位运算
一、位运算符C语言提供了六种位运算符:
& 按位与
| 按位或
^ 按位异或
~ 取反
<< 左移
>> 右移
1. 按位与运算 按位与运算符"&"是双目运算符。其功能是参与运算的两数各对应的二进位相与。只有对应的两个二进位均为1时,结果位才为1 ,否则为0。参与运算的数以补码方式出现。
例如:9&am
nodejs 数据库连接 mongodb mysql
liguangsong
mongodb mysql node 数据库连接
1.mysql 连接
package.json中dependencies加入
"mysql":"~2.7.0"
执行 npm install
在config 下创建文件 database.js
java动态编译
olive6615
java HotSpot jvm 动态编译
在HotSpot虚拟机中,有两个技术是至关重要的,即动态编译(Dynamic compilation)和Profiling。
HotSpot是如何动态编译Javad的bytecode呢?Java bytecode是以解释方式被load到虚拟机的。HotSpot里有一个运行监视器,即Profile Monitor,专门监视
Storm0.9.5的集群部署配置优化
roadrunners
优化 storm.yaml
nimbus结点配置(storm.yaml)信息:
# Licensed to the Apache Software Foundation (ASF) under one
# or more contributor license agreements. See the NOTICE file
# distributed with this work for additional inf
101个MySQL 的调节和优化的提示
tomcat_oracle
mysql
1. 拥有足够的物理内存来把整个InnoDB文件加载到内存中——在内存中访问文件时的速度要比在硬盘中访问时快的多。 2. 不惜一切代价避免使用Swap交换分区 – 交换时是从硬盘读取的,它的速度很慢。 3. 使用电池供电的RAM(注:RAM即随机存储器)。 4. 使用高级的RAID(注:Redundant Arrays of Inexpensive Disks,即磁盘阵列
zoj 3829 Known Notation(贪心)
阿尔萨斯
ZOJ
题目链接:zoj 3829 Known Notation
题目大意:给定一个不完整的后缀表达式,要求有2种不同操作,用尽量少的操作使得表达式完整。
解题思路:贪心,数字的个数要要保证比∗的个数多1,不够的话优先补在开头是最优的。然后遍历一遍字符串,碰到数字+1,碰到∗-1,保证数字的个数大于等1,如果不够减的话,可以和最后面的一个数字交换位置(用栈维护十分方便),因为添加和交换代价都是1