首页 文章 精选 留言 我的

精选列表

搜索[javascript库],共10000篇文章
优秀的个人博客,低调大师

Python全栈 Web(JavaScript DOM节点、事件)

1.查询节点 1.根据节点的层级查询节点 1.childNodes 元素节点,文本节点, 2.children 元素节点 3.parentNode 获取父节点 4.nextSibling 获取下一个兄弟节点 有可能是文本节点 5.nextElementSibling 获取下一个兄弟元素节点 6.previousSibling 获取上一个兄弟节点 有可能是文本节点 7.previousElementSibling 获取上一个兄弟元素节点 2.通过标签名查询节点 - 返回数组 document|elem.getElementsByTagName("标签名"); document:整个文档内查找 elem:某个元素内查找 3.通过元素的name属性值查询节点 document.getElementsByName("name属性值"); 返回值:包含指定name属性值的元素的数组 <

优秀的个人博客,低调大师

javascript中escape()、unescape()、encodeURI()、encodeURIComponent()、decode...

这些URI方法encodeURI()、encodeURIComponent()、decodeURI()、decodeURIComponent()代替了BOM的escape()和unescape()方法。URI方法更可取,因为他们对所有Unicode编号编码,而BOM方法只能对ASCII编号正确编码。尽量避免使用escape()和unescape()方法。 js对文字进行编码设计三个函数:escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decodeURIComponent 1、传递参数时,需要使用encodeURIComponent,这样组合的url才不会被#等特殊字段截断。 例如: 2、进行url跳转时可以整体使用encodeURI 例如:location.href = encodeURI(http://cang.baidu.com/do/s?word=百度&ct=21); 3、js使用数据时可以使用escape 例如:搜藏中history纪录 4、escape对0-255以外的unicode值进行编码输出%u****格式,其他情况下escape,encodeURI,encodeURIComponent编码结果相同。 最多使用的应为encodeURIComponent,他是将中文、韩文等特殊字符装换成UTF-8格式的urll编码,所以结果给后台传递参数需要使用encodeURIComponent时需要后台解码对utf-8支持(form中的编码方式和当前页面编码方式相同) escape不编码字符有69个:*,+,-,.,/,@,_,0-9,a-z,A-Z encodeURI不编码字符有82个:!,#,$,&,',(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z encodeURIComponent不编码字符有71个:!, ',(,),*,-,.,_,~,0-9,a-z,A-Z unescape 方法 从用 escape 方法编码的 String 对象中返回已解码的字符串。 function unescape(charString : String) : String 参数 charString 必选。要解码的 String 对象或文本。 备注 unescape 方法返回一个包含 charstring 内容的字符串值。所有以 %xx 十六进制形式编码的字符都用 ASCII 字符集当中等效的字符代替。以 %uxxxx 格式(Unicode 字符)编码的字符用十六进制编码 xxxx 的 Unicode 字符代替。注意 unescape 方法不应用于解码“统一资源标识符”(URI)。请改用 decodeURI 和 decodeURIComponent 方法。 decodeURI 方法 返回一个已编码的统一资源标识符 (URI) 的非编码形式。 function decodeURI(URIstring : String) : String 参数 URIstring 必选。表示编码 URI 的字符串。 备注 使用 decodeURI 方法代替已经过时的 unescape 方法。 decodeURI 方法返回一个字符串值。 如果 URIString 无效,将发生 URIError。 decodeURIComponent 方法 返回统一资源标识符 (URI) 的一个已编码组件的非编码形式。 function decodeURIComponent(encodedURIString : String) : String 必选的 encodedURIString 参数是一个表示已编码的 URI 组件的值。 备注 URIComponent 是一个完整的 URI 的一部分

优秀的个人博客,低调大师

LCS 算法:Javascript 最长公共子序列

最长公共子序列(Longest Common Subsequence LCS)是从给定的两个序列X和Y中取出尽可能多的一部分字符,按照它们在原序列排列的先后次序排列得到。LCS问题的算法用途广泛,如在软件不同版本的管理中,用LCS算法找到新旧版本的异同处;在软件测试中,用LCS算法对录制和回放的序列进行比较,在基因工程领域,用LCS算法检查患者DNA连与键康DNA链的异同;在防抄袭系统中,用LCS算法检查论文的抄袭率。LCS算法也可以用于程序代码相似度度量,人体运行的序列检索,视频段匹配等方面,所以对LCS算法进行研究具有很高的应用价值。 基本概念 1、子序列(subsequence): 一个特定序列的子序列就是将给定序列中零个或多个元素去掉后得到的结果(不改变元素间相对次序)。例如序列的子序列有:、、等。 2、公共子序列(common subsequence): 给定序列X和Y,序列Z是X的子序列,也是Y的子序列,则Z是X和Y的公共子序列。例如X=[A,B,C,B,D,A,B],Y=[B,D,C,A,B,A[,那么序列Z=[B,C,A]为X和Y的公共子序列,其长度为3。但Z不是X和Y的最长公共子序列,而序列[B,C,B,A]和[B,D,A,B]也均为X和Y的最长公共子序列,长度为4,而X和Y不存在长度大于等于5的公共子序列。对于序列[A,B,C]和序列[E,F,G]的公共子序列只有空序列[]。 3、最长公共子序列:给定序列X和Y,从它们的所有公共子序列中选出长度最长的那一个或几个。 4、子串: 将一个序列从最前或最后或同时删掉零个或几个字符构成的新系列。区别与子序列,子序列是可以从中间抠掉字符的。cnblogs这个字符串中子序列有多少个呢?很显然有27个,比如其中的cb,cgs等等都是其子序列 给一个图再解释一下: 我们可以看出子序列不见得一定是连续的,连续的是子串。 问题分析 我们还是从一个矩阵开始分析,自己推导出状态迁移方程。 首先,我们把问题转换成前端够为熟悉的概念,不要序列序列地叫了,可以认为是数组或字符串。一切从简,我们就估且认定是两个字符串做比较吧。 我们重点留意”子序列“的概念,它可以删掉多个或零个,也可以全部干掉。这时我们的第一个子序列为空字符串(如果我们的序列不是字符串,我们还可以 )!这个真是千万要注意到!许多人就是看不懂《算法导论》的那个图表,还有许多博客的作者不懂装懂。我们总是从左到右比较,当然了第一个字符串,由于作为矩阵的高,就垂直放置了。 假令X = "ABCDAB", Y="BDCABA",各自取出最短的序列,也就是空字符串与空字符串比较。LCS的方程解为一个数字,那么这个表格也只能填数字。两个空字符串的公同区域的长度为0. 然后我们X不动,继续让空字符串出阵,Y让“B”出阵,很显然,它们的公共区域的长度为0. Y换成其他字符, D啊,C啊, 或者, 它们的连续组合DC、 DDC, 情况没有变, 依然为0. 因此第一行都为0. 然后我们Y不动,Y只出空字任串,那么与上面的分析一样,都为0,第一列都是0. LCS问题与背包问题有点不一样,背包问题还可以设置-1行,而最长公共子序列因为有空子序列的出现,一开始就把左边与上边固定死了。 然后我们再将问题放大些,这次双方都出一个字符,显然只有两都相同时,才有存在不为空字符串的公共子序列,长度也理解数然为1。 A为"X", Y为"BDCA"的子序列的任意一个 继续往右填空,该怎么填?显然,LCS不能大于X的长度,Y的从A字符串开始的子序列与B的A序列相比,怎么也能等于1。 如果X只从派出前面个字符A,B吧,亦即是“”,“A”, "B", "AB"这四种组合,前两个已经解说过了。那我们先看B,${X1} == ${Y0}, 我们得到一个新的公共子串了,应该加1。为什么呢?因为我们这个矩阵是一个状态表,从左到右,从上到下描述状态的迁移过程,并且这些状态是基于已有状态累加出来的。现在我们需要确认的是,现在我们要填的这个格子的值与它周围已经填好的格子的值是存在何种关系。目前,信息太少,就是一个孤点,直接填1。 然后我们让Y多出一个D做帮手,{"",A,B,AB} vs {"",B,D,BD},显然,继续填1. 一直填到Y的第二个B之前,都是1。 因为到BDCAB时,它们有另一个公共子序列,AB。 到这一步,我们可以总结一些规则了,之后就是通过计算验证我们的想法,加入新的规则或限定条件来完善。 Y将所有字符派上去,X依然是2个字符,经仔细观察,还是填2. 看五行,X再多派一个C,ABC的子序列集合比AB的子序列集合大一些,那么它与Y的B子序列集合大一些,就算不大,就不能比原来的小。显然新增的C不能成为战力,不是两者的公共字符,因此值应该等于AB的子序列集合。 并且我们可以确定,如果两个字符串要比较的字符不一样,那么要填的格子是与其左边或上边有关,那边大就取那个。 如果比较的字符一样呢,稍安毋躁,刚好X的C要与Y的C进行比较,即ABC的子序列集合{"",A,B,C,AB,BC,ABC}与BDC的子序列集合{"",B,D,C,BD,DC,BDC}比较,得到公共子串有“”,B,D 。这时还是与之前的结论一样,当字符相等时,它对应的格子值等于左边与右边与左上角的值,并且左边,上边,左上边总是相等的。这些奥秘需要更严格的数学知识来论证。 我们现在用下面的方程来继续填表了。 程序实现 LCS可以进一步简化,只要通过挪位置,省去新数组的生成。 打印一个LCS 我们再给出打印函数,先看如何打印一个。我们从右下角开始寻找,一直找到最上一行终止。因此目标字符串的构建是倒序。为了避免使用stringBuffer这样麻烦的中间量,我们可以通过递归实现,每次执行程序时,只返回一个字符串,没有则返回一个空字符串, 以 printLCS(x,y,...)+str[i]相加,就可以得到我们要求的字符串。 我们再写出一个方法,来验证我们得到的字符串是否真正的LCS字符串。作为一个已经工作的人,不能写的代码像在校生那样,不做单元测试就放到线上让别人踩坑。 使用: 打印全部LCS 思路与上面差不多,我们注意一下,在LCS方法有一个Math.max取值,这其实是整合了三种情况,因此可以分叉出三个字符串。我们的方法将返回一个es6集合对象,方便自动去掉。然后每次都用新的集合合并旧的集合的字任串。 使用: 空间优化 使用滚动数组: 危险的递归解法 str1的一个子序列相应于下标序列{1, 2, …, m}的一个子序列,因此,str1共有${2^m}$个不同子序列(str2亦如此,如为${2^n}$),因此复杂度达到惊人的指数时间(${2^m * 2^n}$)。 原文发布时间为:2018-07-23本文作者:Kaelan Cooter 本文来自云栖社区合作伙伴“前端大学”,了解相关信息可以关注“前端大学”

优秀的个人博客,低调大师

快来围观一下JavaScript的Proxy

的确写Proxy文章很多,那么今天我也不凑字数了,炒两个栗子吧。 一、虚拟属性 const person = { name: 'xiaoyun', province: '江苏省', city: '南京市' } 对于上述对象,我们可能需要地址信息(由省市拼接而成),在此之前我们可能会采取下列方式: 直接在person对象上声明一个address属性; 当用到address信息时,再通过person拼接。 第一个方法的主要弊端是污染了原有的对象,而第二种方法就很不灵活。现在我们可以通过Proxy实现比较好的效果: const enhancePerson = new Proxy(person, { get (target, name) { switch (name) { case 'address': return `${target['province']}-${target['city']}` default: return target[name] } } }) enhancePerson.address // 江苏省-南京市 通过这种方式我们就可以实现虚拟属性了,因为它不会被遍历出来: Object.keys(enhancePerson) // [ 'name', 'province', 'city' ] 这里还有一个我觉得比较容易忽略的点: person === enhancePerson // false enhancePerson.city = '苏州市' enhancePerson.city === person.city // true 显然这两个并不是同一个对象,但是我通过改变enhancePerson的city属性却影响到了person的city属性,这就是我们通常会忽略掉的,如果你不设置Proxy的set方法,它会保持默认行为: set (target, propKey, value) { target[propKey] = value } 可能有些同学会想不就是不让它遍历出来吗?看这招: const person = { name: 'xiaoyun', province: '江苏省', city: '南京市', get address () { return `${this.province}-${this.city}` } } const enhancePerson = new Proxy(person, { ownKeys (target) { return Object.keys(target).filter(item => item !== 'address') } }) enhancePerson.address // 江苏省-南京市 Object.keys(enhancePerson) // [ 'name', 'province', 'city' ] 虽然是实现了上述的功能,但是Proxy中的ownKeys拦截的方法太多,所以我们拦截ownKeys之后,会导致某些方法无法使用,并且拦截ownKeys返回的结果也有严格的要求: 返回的结果必须是一个数组 并且数组的元素必须是String或者Symbol类型 结果必须包含对象的所有不可配置、自身拥有的属性 如果对象不能扩展,则结果只能包含自身拥有的属性,不能含有其他属性 所以在拦截方法注意点很多,不然很容易出现问题。 Tip: 未通过defineProperty定义的属性的描述器属性默认为true,否则默认为false。 二、扩展基本操作 当我第一次接触Python时,比较有印象的就是它的List的一个语法: arr[1:3],以前只有羡慕的份,现在完全可以自己撸一个: const arr = [1, 2, 3, 4, 5, 6, 7, 8] const list = new Proxy(arr, { get (target, name) { if (name.includes(':')) { const indexs = name.split(':') return target.slice(indexs[0], indexs[1]) } return target[name] } }) list['2:6'] // [ 3, 4, 5, 6 ] 是不是,对于对象,我们同样可以采用类似的方法: const obj = { a: { b: { c: 'xiaoyun' } } } const obj1 = new Proxy(obj, { get (target, name) { const keys = name.split('.') return keys.reduce((pre, next) => { if (pre !== null && pre !== undefined) { pre = pre[next] } return pre }, target) } }) obj1['a.b.c'] // xiaoyun 原文发布时间为:2018年05月26日 原文作者: 云起时 本文来源:掘金如需转载请联系原作者

优秀的个人博客,低调大师

4.2 Javascript之执行环境和作用域

执行环境 每个执行环境都有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在这个对象中。 //书中说我们自己编写的代码无法访问这个对象 //下面这个最外层的执行环境window对象是可以访问的呢??? web浏览器中,最外层的执行环境是window对象,因此所有的全局变量和函数都是作为window的属性或者方法创建的 作用域链 作用域链的用途是保证执行环境对有权限访问的变量和函数的有序访问 作用域链的前端都是当前执行代码所在环境的变量对象 如果这个环境是函数,则将其活动对象作为变量对象,活动对象在一开始的时候只包含了arguments对象,作用域链中的下一个变量对象来自于包含(外部)环境,再下一个变量对象则来自于下一个包含(外部)对象。。。一直延伸到全局执行环境(全局执行环境的变量对象始终是作用域链中的最后一个对象) var globalColor = "globalColor"; function globalFunc(){ //这里能访问函数里的变量和方法,但是不能访问innerFunc函数里的变量 var globalColor = "globalFuncColor"; function innerFunc(){ //这里可以访问此函数里的所有变量和方法,还有外部的所有变量和方法 var innerFuncColor = "innerFuncColor"; var globalColor = "globalColor-innerFuncColor"; innerFuncColor = globalColor; console.log(innerFuncColor) } console.log(globalColor) innerFunc(); } globalFunc(); console.log(globalColor) //globalFuncColor //globalColor-innerFuncColor //globalColor //优先访问当前执行代码环境的变量对象 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 延长作用域链 执行环境的类型:全局和局部(函数) function buildUrl(){ var href = "test.com"; with(location){ var res = href + href; } return res; } buildUrl(); //width里的href代表的是location.href,所以结果里并没有"test.com" 1 2 3 4 5 6 7 8 9 try{ console.log(myTest) }catch(ex){ console.dir(ex.message); }; // 对于捕获来说会创建一个新的变量对象,包含的是被抛出来的错误对象的声明 // 意思应该是新创建的执行环境下可以访问到抛出的错误对象 1 2 3 4 5 6 7 无块级作用域 for(var i = 0; i < 10; i++){ console.log(i); } console.log("now i is: " + i); //now i is 10 //变量i定义在for循环里面,循环结束后,还是可以访问到变量i,并没有销毁 1 2 3 4 5 6 变量查找 var color = "red"; function getColor(){ return color; } console.log(getColor()) //调用getColor函数时,返回color变量的值,首先会在getColor函数的作用域内查找color变量 //没有找到变量,就会沿着作用域链继续向上层的作用域查找,找到就返回变量的值 //否则会一直向上查找至window全局作用域,如果全局作用域下查找不到,则就表明变量未声明 //优先返回局部作用域下的同名变量 原文发布时间:2018年03月15日 本文来源CSDN博客如需转载请紧急联系作者

资源下载

更多资源
Mario

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长,特征是大鼻子、头戴帽子、身穿背带裤,还留着胡子。与他的双胞胎兄弟路易基一起,长年担任任天堂的招牌角色。

Nacos

Nacos

Nacos /nɑ:kəʊs/ 是 Dynamic Naming and Configuration Service 的首字母简称,一个易于构建 AI Agent 应用的动态服务发现、配置管理和AI智能体管理平台。Nacos 致力于帮助您发现、配置和管理微服务及AI智能体应用。Nacos 提供了一组简单易用的特性集,帮助您快速实现动态服务发现、服务配置、服务元数据、流量管理。Nacos 帮助您更敏捷和容易地构建、交付和管理微服务平台。

Spring

Spring

Spring框架(Spring Framework)是由Rod Johnson于2002年提出的开源Java企业级应用框架,旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念,提供核心容器、应用上下文、数据访问集成等模块,支持整合Hibernate、Struts等第三方框架,其适用范围不仅限于服务器端开发,绝大多数Java应用均可从中受益。

WebStorm

WebStorm

WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。目前已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源,继承了IntelliJ IDEA强大的JS部分的功能。

用户登录
用户注册