JavaScript – 艾丽卡 Blog

全部

2024年4月21日

发表 admin at 2024年4月21日

类别

JavaScript

JavaScript: Chrome 控制台中无法粘贴代码

1. 问题概述：将代码复制粘贴到 Chrome Devtools 去执行的时候会出现一个警告: Warning: Don’t paste code into the DevTools Console that you don’t understand or haven’t reviewed yourself. This could allow attackers to steal your identity or take control of your computer. Please type ‘allow pasting’ below to allow pasting. 警告:不要将您不理解或没有亲自检查过的代码粘贴到DevTools控制台。这可能允许攻击者窃取您的身份或控制您的计算机。请在下面键入允许粘贴以允许粘贴。需要在 Console 输入 allow pasting 后 Enter 开启（右键）…

2024年4月17日

发表 admin at 2024年4月17日

类别

JavaScript

JavaScript: Chrome 控制台中用双方括号(Firefox中为尖括号)显示的JavaScript对象属性

概述： Chrome/Firefox控制台中用双方括号(double square brackets)或尖括号(angle brackets)显示的对象属性，表示这些属性是JavaScript内部的一些属性。 Chrome Borrowing the ECMAScript notation, the Console encloses some properties internal to JavaScript in double square brackets. 控制台借用 ECMAScript 表示法，将 JavaScript 内部的一些属性用双方括号括起来。 https://developer.chrome.com/docs/devtools/console/reference?hl=zh-cn#inspect-internal-properties Firef…

2024年2月19日

发表 admin at 2024年2月19日

类别

JavaScript

JavaScript: @@ 符号(两个"at")在ES6 JavaScript中的含义

概述 @@描述所谓的众所周知的符号(Well-Known Symbols)。（请注意，它实际上不是JS中有效的语法。） @@name 可以理解为：Symbol.name 参考链接 https://262.ecma-international.org/6.0/#sec-well-known-symbols 6.1.5.1 Well-Known Symbols Well-known symbols are built-in Symbol values that are explicitly referenced by algorithms of this specification. They are typically used as the keys of properties whose values serve as extension points of a specification a…

2023年7月30日

发表 admin at 2023年7月30日

类别

JavaScript

JavaScript: JSONP原理详解

1. 什么是jsonp jsonp全称json with padding，由于浏览器同源策略的限制，网页中无法通过 Ajax 请求非同源的接口数据。但是 <script> 标签不受浏览器同源策略的影响，可以通过 src 属性，请求非同源的 js 脚本。因此，JSONP 的实现原理，就是通过 <script> 标签的 src 属性，请求跨域的数据接口，并通过函数调用的形式，接收跨域接口响应回来的数据。由于 JSONP 是通过 <script> 标签的 src 属性，来实现跨域数据获取的，所以，JSONP 只支持 GET 数据请求，不支持 POST 请求。注意：JSONP 和 Ajax 之间没有任何关系，不能把 JSONP 请求数据的方式叫做 Ajax，因为 JSONP 没有用到XMLHttpRequest 这个对象。 2. 那么有哪些标签可以跨域呢 <…

2023年7月28日

发表 admin at 2023年7月28日

类别

JavaScript

JavaScript: js命名规范

ECMAScript 规范中标识符采用驼峰大小写格式，驼峰命名法由小(大)写字母开始，后续每个单词首字母都大写。根据首字母是否大写，分为两种方式： Pascal Case 大驼峰式命名法：首字母大写。eg：StudentInfo、UserInfo、ProductInfo Camel Case 小驼峰式命名法：首字母小写。eg：studentInfo、userInfo、productInfo 标识符，则包括变量、函数名、类名、属性名和函数或类的参数，每个命名方法又略有不同，下面详细解释一下： 1.项目命名全部采用小写方式，以下划线分隔。示例：my_project_name 2.目录命名参照项目命名规则；有复数结构时，要采用复数命名法。示例：scripts, styles, images, data_models 3.JS文件命名变量：必须采…

2023年7月28日

发表 admin at 2023年7月28日

类别

JavaScript

JavaScript: jQuery对象和DOM对象的相互转换

一、jQuery对象 1. 用原生 JS 获取来的对象就是 DOM 对象 2. jQuery 方法获取的元素就是 jQuery 对象。 3. jQuery 对象本质是：利用$对DOM 对象包装后产生的对象（伪数组形式存储）。注意：只有 jQuery 对象才能使用 jQuery 方法，DOM 对象则使用原生的 JavaScirpt 方法。二、jQuery对象和DOM对象的相互转换 DOM 对象与 jQuery 对象之间是可以相互转换的。因为原生js 比 jQuery 更大，原生的一些属性和方法 jQuery没有给我们封装。要想使用这些属性和方法需要把jQuery对象转换为DOM对象才能使用。 1. DOM 对象转换为 jQuery 对象： $(DOM对象) $('div') 2. jQuery 对象转换为 DOM 对象（两种方式） $('div') [index] // index 是索引号 $('div…

2023年7月27日

发表 admin at 2023年7月27日

类别

JavaScript

JavaScript: js XMLHttpRequest发送Ajax请求

1. 什么XMLHttpRequest XMLHttpRequest（简称 xhr）是浏览器提供的 Javascript 对象，通过它，可以请求服务器上的数据资源。之前所学的 jQuery 中的 Ajax 函数，就是基于 xhr 对象封装出来的。 2. 使用xhr发起GET请求步骤：创建 xhr 对象调用 xhr.open() 函数调用 xhr.send() 函数监听 xhr.onreadystatechange 事件例子： // 1. 创建 XHR 对象 var xhr = new XMLHttpRequest() // 2. 调用 open 函数，指定请求方式与 URL地址 xhr.open('GET', 'http://www.domain.com/') // 3. 调用 send 函数，发起 Ajax 请求 xhr.send() // 4. 监听 onreadystatechange 事件 xhr.onre…

2023年7月27日

发表 admin at 2023年7月27日

类别

JavaScript

JavaScript: jQuery 多库共存

jQuery版本不断更新，若最初使用的 jQuery 版本无法满足需求，这时就需要保证在旧有版本正常运行的情况下，新的功能使用新的jQuery版本实现，这种情况被称为，jQuery 多库共存。解决方法如下： <body> <script src="js/jquery-1.12.4.js"></script> <script src="js/jquery-3.7.0.js"></script> <script> //1.如何查看jQuery的版本? //通过jQuery文件名来查看jQuery的版本是不靠谱的做法. //通过以下四种方式可以查看jQuery的版本. // console.log(jQuery.fn.jquery); // console.log(jQuery…

2023年7月27日

发表 admin at 2023年7月27日

类别

JavaScript

JavaScript: js获取元素尺寸和大小操作总结

一、获取元素的行内样式 var obj = document.getElementById("test"); alert(obj.height + "n" + obj.width); // 200px 200px typeof=string只是将style属性中的值显示出来二、获取计算后的样式 var obj = document.getElementById("test"); var style = null; if (window.getComputedStyle) { style = window.getComputedStyle(obj, null); // 非IE } else { style = obj.currentStyle; // IE } alert("width=" + style.width + "nheight=" + style.height)…

2023年7月26日

发表 admin at 2023年7月26日

类别

JavaScript

JavaScript: js可枚举属性和不可枚举属性

我们一般认为，可以被for in遍历出来的属性就是可枚举属性，否则就是不可枚举属性。对象的属性的可枚举性和不可枚举性是由属性的enumerable值决定的，true为可枚举，false为不可枚举。 js中基本包装类型的原型属性是不可枚举的，如Object, Array, Number,Function,Date等，而自己定义的属性一般可枚举，举例： var fun = new Function() for (var key in fun) { console.log(key); // 什么也没打印出来 } var num = new Number() for(var key in num) { console.log(key) // 什么也没打印出来 } var info = { name: '张三', age: 18 } for(var key in info) { console.log(key) //…