js代码 | 易学教程

JavaScript超越了Java，c，python等等成为Stack Overflow上最热门的标签

阅读更多关于 JavaScript超越了Java，c，python等等成为Stack Overflow上最热门的标签

JavaScript超越了Java，c，python等等成为Stack Overflow上最热门的标签在2015年6月至今，JavaScript超越了Java，c，python等等成为Stack Overflow上最热门的标签，并总量操作第二第三的和。新潮的Web开发技术，比如React，Node.js，还有AngularJS正在逐渐起势，都是用的js（es6）。全栈工程师最青睐的技术，JS 第一前端开发者最青睐的技术，JS 自然第一后端开发者最青睐的技术，JS 第一学生程序员最青睐的技术，JS 第二 JavaScript 是这个星球上最受欢迎的编程语言。而且后端开发者甚至更喜欢使用JavaScript来工作。根据职业划分的技术栈 Javascript 可以做什么 1. Web 前端相信这个这个是毫无疑问的，在 Web 前端的地位目前是没有任何语言能撼动它的霸主地位。 image.png 2. 后端 Nodejs Node.js 是一个 Javascript 运行环境(runtime environment)，发布于2009年5月，由Ryan Dahl 开发，实质是对 Chrome V8 引擎进行了封装。Node.js 对一些特殊用例进行优化，提供替代的 API，使得V8在非浏览器环境下运行得更好。使 Javascript 走向了服务端，这使得 Web

常用JS小知识汇总

阅读更多关于常用JS小知识汇总

1 上传图片 :html代码 <input id="image" type='file' name='myFile' size='15' onchange="showPicture(this)" /> <img id="111" src="img/1.jpg" width="133" height="200" /> js代码: <script type="text/javascript"> function showPicture(imgFile) { // alert(window.URL.createObjectURL(imgFile.files[0])); /*获取上传文件的路径*/ document.getElementById("111").src = window.URL.createObjectURL(imgFile.files[0]); } </script> 2 多个json数组合并为一个显示 (定义一个空数组遍历各个子json,然后push进去) 1 str1,str2,str3为3个json数组 2 3 var result = new Array(); 4 5 for (var i = 0; i < str1.length; i++) { 6 result .push(str1[i]); 7 } 8 9 for (var i = 0; i < str2

js函数循环

阅读更多关于 js函数循环

值类型之间的相互转化转字符串：String() | .toString() | "" + // 123..toString() | 重点是 "" + 转数字：Number(a) | parseFloat() | parseInt() | + // +'123' // parseFloat('3.14.15') => 3.14 | parseInt('3.14.15') => 3 转布尔：Boolean(a) 非数字：NaN // 当一个其他类型转化为数字类型的产物 // 任何判断一个结果是否是NaN, isNaN(运算) <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>类型转化</title> </head> <body> 值类型之间的相互转化 </body> <script> // number | string | boolean // 转化为boolean var num = 10; var s = "123"; num = 0; s = ""; var b1 = Boolean(num); var b2 = Boolean(s); console.log(b1, b2); // 后期我们会在if分支结构中的判断以及循环中的判断中使用boolean类型, // 以上两种情况下,

JS控制控件的隐藏显示

阅读更多关于 JS控制控件的隐藏显示

JS代码 var value = "http://" + window.location.host + "/CAD/OneTwoPicure.png"; if ($("#DWhost").val() == value) { document.getElementById("DWGViewX").style.visibility = "hidden"; //设定隐藏 document.getElementById("DWGViewX").style.height = 0; //实在不行就设高度为0 document.getElementById("OneTwoimg").style.visibility = "visible"; //显示控件 } 控件代码 </head> <body style="text-align: center; margin: 0px;" onload="PageHeight()"> <div style="width: 100%; text-align: center;"> <object id="DWGViewX" classid="clsid:AC53EFE4-94A7-47E6-BBFC-E9B9CF322299" codebase="" width="100%"> <param name="_Version" value="65536" />

点滴积累【JS】---JS小功能（JS实现侧悬浮浮动)

阅读更多关于点滴积累【JS】---JS小功能（JS实现侧悬浮浮动)

效果：思路：首先，加载onscroll控制滚动条。然后写缓存运动的方法，缓冲运动的方法是先计算出DIV缓冲的速度，并且将其取整，再进行运动判断什么时候到达终点。最后将其参数返回。再在onscroll里面调用此方法，并且将终点计算出来赋予此方法的参数。代码： 1 <head runat="server"> 2 <title></title> 3 <style type="text/css"> 4 #div1 5 { 6 width: 200px; 7 height: 200px; 8 background: #0000FF; 9 position: absolute; 10 right: 0; 11 bottom: 0; 12 } 13 </style> 14 <script type="text/javascript"> 15 window.onscroll = function () { 16 var oDiv = document.getElementById('div1'); 17 var DivScroll = document.documentElement.scrollTop || document.body.scrollTop; //获取移动高度 18 // oDiv.style.top = (document.documentElement

点滴积累【JS】---JS小功能（JS实现多功能缓冲运动框架)

阅读更多关于点滴积累【JS】---JS小功能（JS实现多功能缓冲运动框架)

效果：思路：首先，多功能框架实现的功能是:css中所有的属性都可以添加进去（也可以把方法作为参数传递过去！），然后进行缓冲运动，比如：物体的高度、长度、颜色、字体大小、透明度等，都可以直接传入参数然后进行运动，简单的说是利用json字符串把数据拼接起来，然后进行传参，参数传入进去到函数以后，根据参数的对象，还有属性，还有函数方法，然后再利用setInterval进行缓冲运动，最后判断运动什么时候结束。有一点要注意的是先用getStyle方法获取非行间样式！！！代码： 1 <head id="Head1" runat="server"> 2 <title></title> 3 <style type="text/css"> 4 div 5 { 6 width: 100px; 7 height: 100px; 8 background: #00FF00; 9 left: 0; 10 position: absolute; 11 font-size: 20; 12 opacity: 0.3; 13 } 14 </style> 15 <script type="text/javascript"> 16 window.onload = function () { 17 var divOn = document.getElementById('div1'); 18 divOn.timer

【Python全栈-JavaScript】js Event()对象

阅读更多关于【Python全栈-JavaScript】js Event()对象

JavaScript同步和异步+宏任务和微任务+事件同步和异步所有的点击事件都是异步的注意：所有事件函数(addEventListener)都不能return /* * 同步和异步 * 同步,是指代码从上向下执行,执行完一条,才去执行下一条,是按照顺序按照步骤的执行 * * 异步,代码执行需要有一个过程,或者需要一定的时间,或者开始的时间不确定,这时候 * 我们先让别的不相关的代码执行,而当前代码当执行完成后去执行一个回调函数 * * * 注意：如果代码写在script中,并且写在函数外部,那么这个代码他只能执行一次,并且 * 是在开始时就同步执行了,显然这种方式不利于代码中出现交互,因此,代码就需要写在 * 函数中,减少代码之间同步执行方式。函数外通常仅用来定义变量(全局)和执行初始化函数 * * */ var sum=0; var bn=document.querySelector("button"); // 所有的事件都是异步 bn.addEventListener("click",clickHandler); function clickHandler(e) { sum++; oneFn(sum); //回调 // return sum; //注意：所有事件函数都不能return } function oneFn(sum) { console.log(sum,"1__

原生js深入理解系列（七）--- 读JavaScript 执行机制的一点小总结

阅读更多关于原生js深入理解系列（七）--- 读JavaScript 执行机制的一点小总结

3 月，跳不动了？>>> 总结： js的执行机制是：单线程运行，主线程跑任务，线程队列一个一个宏任务来运行，并且把宏任务内的微任务的全部运行完再继续下一个宏任务。首先是同步执行其次是异步执行除了广义的同步任务和异步任务，我们对任务有更精细的定义： macro-task(宏任务)：包括整体代码script，setTimeout，setInterval micro-task(微任务)：Promise，process.nextTick（promise的回调then（）是微任务）主线程里立即执行的是：new promise， promise 语句， console.log 按出现的先后执行立即执行的执行完后执行同一个宏任务里的微任务队列，微任务依次执行完毕后再继续下一个宏任务。下面请看掘金作者ssssyoki大佬的娓娓道来，为我们彻底的细致的理解js的执行机制。这一次，彻底弄懂 JavaScript 执行机制本文的目的就是要保证你彻底弄懂javascript的执行机制，如果读完本文还不懂，可以揍我。不论你是javascript新手还是老鸟，不论是面试求职，还是日常开发工作，我们经常会遇到这样的情况：给定的几行代码，我们需要知道其输出内容和顺序。因为javascript是一门单线程语言，所以我们可以得出结论： javascript是按照语句出现的顺序执行的看到这里读者要打人了

这一次，彻底弄懂 JavaScript 执行机制

阅读更多关于这一次，彻底弄懂 JavaScript 执行机制

3 月，跳不动了？>>> 点点这个链接免费获取：【推荐】2020年最新Java电子书集合.pdf(吐血整理) >>> 本文的目的就是要保证你彻底弄懂JavaScript的执行机制，如果读完本文还不懂，可以揍我。不论你是javascript新手还是老鸟，不论是面试求职，还是日常开发工作，我们经常会遇到这样的情况：给定的几行代码，我们需要知道其输出内容和顺序。因为javascript是一门单线程语言，所以我们可以得出结论： javascript是按照语句出现的顺序执行的看到这里读者要打人了：我难道不知道js是一行一行执行的？还用你说？稍安勿躁，正因为js是一行一行执行的，所以我们以为js都是这样的： let a = '1' ; console .log(a); let b = '2' ; console .log(b); 然而实际上js是这样的： setTimeout( function () { console .log( '定时器开始啦' ) }); new Promise ( function ( resolve ) { console .log( '马上执行for循环啦' ); for ( var i = 0 ; i < 10000 ; i++){ i == 99 && resolve(); } }).then( function () { console .log(

利用JS实现前端路由

阅读更多关于利用JS实现前端路由

在以前的web程序中，路由字眼只出现在后台中。但是随着SPA单页面程序的发展，便出现了前端路由一说。单页面顾名思义就是一个网站只有一个html页面，但是点击不同的导航显示不同的内容，对应的url也会发生变化，这就是前端路由做的事。也就是通过JS实时检测url的变化，从而改变显示的内容。目前很多前端框架都有接口去实现路由，比如vuejs的vue-route等。我们可以利用原生的hashchange事件来模拟一个简单的路由。实例的html代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> .content{ position:absolute; left: 0px; top:0px; display: none; } .content:nth-child(1){ display: block; } </style> <script src="js/jquery-2.2.1.min.js"><

订阅 js代码