js

JavaScript

风格不统一 提交于 2020-02-18 21:38:07
1.JavaScript历史 布兰登.艾奇在1995年利用10天完成JavaScript设计。最开始在网景工作,网景最初命名为LiveScript,后来在与Sun合作之后将其改名为JavaScript,因为sun公司的主打是java,所以为了蹭javascript的热度,但内部实现原理与Java不同。 2.JavaScript是什么 JavaScript是世界上最流行的语言之一,是一种运行在客户端(自己的电脑)的脚本语言(Script是脚本的意思) 脚本语言:不需要编译,运行过程中有js解释器(js引擎)逐行来进行解释并执行 现在也可以基于Node.js技术进行服务器端编程。 3.JS的用处 最开始的作用是表单动态验证,在没有JS之前,要经过后台验证表单,给服务器带来很大压力。 网页特效 服务端开发(Node.js) 桌面程序(Electron) APP(Cordova) 控制硬件-物联网(Ruff) 游戏开发(cocos2d-js) 4.HTML/CSS/JS的关系 HTML决定看到什么 CSS决定好不好看 JS决定功能 5.浏览器执行JS简介 浏览器分成两部分 渲染引擎和JS引擎 渲染引擎 :用来解析HTML与CSS,俗称内核,比如chrome浏览器的blink,老版本的webkit JS引擎 :也称为JS解释器。用来读取网页中的JavaScript代码,对其处理后运行

前端js脚本与防止js脚本

拜拜、爱过 提交于 2020-02-18 21:32:22
前言 身为一名前端开发工程师,有时候业务场景是无法用手速模拟的,老司机也有翻车的时候【你懂得】。因此我特意写这一篇文章,希望能够对大家有所帮助。 涉及到的内容: 1.chrome浏览器 2.js代码 3.函数节流 第一步 打开chrome浏览器,使用组合键Ctrl+shift+i打开开发者工具,接下来如图所示。 点击snippets 第二步 如图所示 点击new snippet -->输入脚本‘名称’-->Ctrl+s保存。 第三步 如图所示 选择新创建的脚本‘名称’,在如图所示的第二步进行编辑js代码。最后如第三步所示:run 运行代码。 js脚本代码 1.以下是网站上的代码: <body> <div class="box"> <img class="img" src="image/pict.png" /> <button class="btn" id='btn'>抢购</button> </div> <script type="text/javascript"> /** * 抢购按钮 * * */ btn.onclick=function(){ console.log('抢购成功!'); }; </script> </body> 每次点击抢购 控制台输出 抢购成功! 2.脚本代码 /** * 最简单的脚本代码 * 版本1.0.1 */ btn.click();/

js prototype新感悟

大兔子大兔子 提交于 2020-02-18 21:32:08
prototype是js的一个原型属性,这个属性可以创建对象属性和方法。 子类继承原型属性时,会继承父类的原型属性和方法。 prototype只能作用到类上,不能作用到对象上。 ---------------------------------------------------------------------------------- js中的call和apply方法是用来改变this指向的对象,call方法传入的是以,分割的参数。 apply方法传入的是数组。 ----------------------------------------------------------------------------------- 在用函数创建js对象时,该函数就是js类的构造函数。 ----------------------------------------------------------------------------------- js类没有class的概念。 ----------------------------------------------------------------------------------- js闭包:一般函数内部的变量,从函数外部是访问不到的,闭包的作用就是使得可以从函数外部访问函数内部的变量。 例如 function add

SharePoint 之JS感悟-js脚本

你说的曾经没有我的故事 提交于 2020-02-18 21:31:51
  最近有些迷恋js脚本,因为自己对Asp.net不够熟悉,又是Moss的一年级新生,不是对代码开发不感兴趣,面向对象自己也了解一些,代码也能大致读懂,个人觉得还是经验积累,作为代码开发人员,还是需要3-5年的编程经验,程序就是这样,熟悉的过程。而相对,js就比较简单了,自己最近也比较迷恋js脚本,相比代码用对象模型或者ASP.net程序去读写SharePoint库,自己还是倾向于用js脚本进行操作,而SharePoint提供的定制功能也是很强大的,当然效率的问题和安全性的问题,都是必须要考虑的,自己也会在学习中不断完善自己的思路。   下面还是介绍下自己对js与SharePoint结合的一点点感悟吧,首先就是表间级联,SharePoint最大的优点就是平台性,很多东西都开发出来了,而我们需要做的就是怎么灵活的运用这些已经存在的东西,表间级联我的应用例子就是自己的一篇文章,给文档库添加评论。在给文档库的一篇文档添加评论的同时,把这个文档的ID作为列表中的一栏写到评论列表中,这个过程就是js脚本找到文档的ID然后放到定制的新建表单中,在保存评论时将ID带见评论表,而再通过筛选将文档的评论筛选出来。个人认为这是一个相当不错的思路,至少我是为了这个想法兴奋了好些日子。   相对而言,SharePoint很多的东西是开发出来了,但是很多东西看起来更像半成品,尤其很多页面的样式

js 异步实现与编程

点点圈 提交于 2020-02-18 21:28:22
同步 同步 同步是代码从上到下依次执行,上一个任务结束后,才能执行下一个任务。 如下图所示,任务1执行完后,再执行任务2,任务2执行完后再执行任务3,依次类推... 同步优势 同步是任务有序进行,不会造成资源上处理上的混乱。 1.任务有序进行较好的处理了任务之间的依赖性,如后一个任务需要前一个任务的结果。 2.如果多个任务处理同一个资源,不会造成资源处理的混乱。 var a = 1; function task1(){   console.log(a);   for(var i = 0; i <10000;i++){     a++; }   console.log(a); } function task2(){   console.log(a);   for(var i = 0; i <10000;i++){     a--; }   console.log(a); } task1(); task2(); task1、task2都操作变量a。先执行task1, 执行完 task1后得到一个a的结果值。然后task2处理task1处理的结果值。 如果task1与task2不是同步的,task1没有执行完,去执行task2,task2执行一会,再去执行task1,... ,可能a的值都不是task1、 task2想要的结果。 同步弊端 同步上从上到下依次执行的,必须等到上个任务完成

Js同步异步机制

半城伤御伤魂 提交于 2020-02-18 21:28:03
JavaScript引擎是单线程的,强制所有的异步事件排队等待执行 setTimeout 和 setInterval 在执行异步代码的时候有着根本的不同 如果一个计时器被阻塞而不能立即执行,它将延迟执行直到下一次可能执行的时间点才被执行(比期望的时间间隔要长些) 如果 setInterval 回调函数的执行时间将足够长(比指定的时间间隔长),它们将连续执行并且彼此之间没有时间间隔 animate因为内部利用的实际是 setInterval $(function(){ for(var i=0;i<10;i++){ $("div").animate({left:'100px',top:'0px'},1000,'swing',function({ $("div").animate({left:'100px',top:'0px'},1000,'swing'); console.log(2) })); console.log(1) } }) 会先打印10次 1 然后执行animate内容一次,打印10次2,最后执行剩下的9次animate 若有嵌套层级关系,则根据依次排队顺序读取运行 来源: https://www.cnblogs.com/lwboke/p/6938008.html

教你如何在博客园放“可运行\"代码

可紊 提交于 2020-02-18 20:03:25
原文地址: http://www.cnblogs.com/littledu/archive/2011/05/08/2040298.html 教你如何在博客园放“可运行"代码 自从看到别人的博客可以放上面那种可运行的代码后,我一直在研究这种效果是怎么弄出来的,我知道蓝色理想上面可以在编辑器里直接将代码放进一个可运行的代码框,发布后就是可运行的了。但博客园的默认的三个编辑器里,死活找不到那可运行的按钮。直到昨天,在群里某高手提示说可以自己写一个,然后他给我说了思路,并提供了一个demo,就是在页面嵌入一个textarea,然后单击运行代码时,将textarea里的所有内容在新open的页面里执行,就行了。我在本地测试,实践结果是可行的,但一放上博客园这里,<script>总给过滤掉了,实在是郁闷得很。无奈,昨天又以失败告终。 今天,就在刚刚,我又在某群发问了,另一高手回答了我的问题,我才知道,怎样才能让script不被过滤。下面,是步骤: 1.首先,准备一个textarea,这个文本框里放上我们所要执行的代码,可以是任意代码,比如一个标准的html页,也可以像我下面一样,直接放上一段js代码,如下: 1 <textarea cols= "20" rows= "8" id= "con" > 1 <script type= "text/javascript" > 2 alert(

原生js给元素添加类

那年仲夏 提交于 2020-02-18 19:18:43
  这个问题可以使用 setAttribute() 或者 className 属性给元素添加类名,使用方法为 ele.setAttribute("class",newClass) 或者 ele.className = newClass ,但这样相当于重写了元素的className属性,会使元素原本已有的class被覆盖,这个效果其实是替换class而非添加。   要做到添加该如何实现呢,思路是先获取当前的 className ,然后设置className为当前取得值+“ ”+newClass(添加的前提是判断要加入的类是否已存在) 代码实现如下: 1 function hasClass(cla, element) { 2 if(element.className.trim().length === 0) return false; 3 var allClass = element.className.trim().split(" "); 4 return allClass.indexOf(cla) > -1; 5 } 6 7 function addClass(cla,element){ 8 if(!hasClass(cla,element)){ 9 if(element.setAttribute){ 10 element.setAttribute("class",element

js替代frame

狂风中的少年 提交于 2020-02-18 17:28:34
我们都应该知道蜘蛛不喜欢iframe或frame,因为蜘蛛访问垃圾桶网站时捕获的HTML是调用其他网页HTML文件的代码,并且不包含任何文本内容,也就是说,蜘蛛不知道你网页的内容是什么。有些人可能会说搜索引擎蜘蛛也可以跟踪和抓取他们调用的HTML文件。是的,它可以跟踪爬网,但跟踪这部分内容通常不是一个完整的页面。搜索引擎无法判断主框架的哪个部分是被调用的文件。随着搜索技术的发展,它可能并不总是能够解决这个问题,但这么多的蜘蛛不会因为你而努力工作。所以,当你不得不使用iframe框架时, 垃圾桶 建议你继续阅读。 从使用iframe调用expres s 100进行express查询,到推出互推联盟的iframe调用代码,垃圾桶对iframe有了深入的了解。记住,当互助推送联盟推出自适应iframe代码时,垃圾箱发表了以下评论:后来,偶然的测试让我想到用JS封装iframe来避免搜索引擎的捕获。当时,我正在测试用JS封装CSS代码,只想加密我自己的工作结果。不,我突然想到既然JS可以输出CSS,JS也应该输出iframe!实际测试表明我的想法是可行的!通过JS输出iframe代码,可以很好的实现直接调用iframe代码的效果! 来源: https://www.cnblogs.com/blogst/p/12326791.html

MUI 图片上传实现

≡放荡痞女 提交于 2020-02-18 16:11:40
HTML代码 <!doctype html> <html> <head> <meta charset="UTF-8"> <title>信息修改</title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <link href="css/mui.min.css" rel="stylesheet" /> <link rel="stylesheet" href="css/mui.picker.min.css" /> <link rel="stylesheet" href="css/common.css" /> <link rel="stylesheet" href="css/personInfor.css" /> </head> <body> <header class="mui-bar mui-bar-nav"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> <h1 class="mui-title">信息修改</h1> <a class="mui-icon mui-icon-more mui