小红书学习——JS（不定时更新）

最新推荐文章于 2025-07-22 14:46:54 发布

Elare

最新推荐文章于 2025-07-22 14:46:54 发布

阅读量3.4k

点赞数

CC 4.0 BY-SA版权

文章标签： html 小红书 JS

本文链接：https://blog.youkuaiyun.com/Elare/article/details/73457897

本文详细介绍了JavaScript中的变量作用域，强调了全局变量的潜在问题。探讨了DOM事件处理，特别是拖动事件，并讲解了字符串、正则表达式的关键属性和方法。还提到了JavaScript的严格模式，指出其对于代码质量的影响。此外，文章讨论了数组、JSON转换、函数的Arguments对象，以及this关键字和闭包的概念，最后讲解了如何通过DOM操作改变HTML元素的属性和样式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JS

如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。

这条语句：
```
function func(){
 carname="Volvo";
}
```
将声明一个全局变量 carname，即使它在函数内执行。
DOM事件

拖动事件：

在拖动对象范围上的触发事件	描述
ondragstart	开始拖动时触发
ondrag	正在拖动时触发
ondragend	完成拖动时触发

在释放目标范围上的触发事件	描述
ondragenter	拖动对象进入目标容器范围内触发
ondragover	拖动对象在目标容器范围内拖动触发
ondragleave	拖动对象离开目标容器
ondrop	释放鼠标键时触发

3. 字符串

不要创建String 对象，会拖慢执行速度var x = new String('dasda')
属性：prototype(允许向对象添加属性和方法)、length(返回字符串长度)、constructor(返回创建字符串属性的函数)
1. 正则表达式
方法：
1. search()搜索匹配子串并返回起始位置
2. replace()替换匹配子串
3. match()检查是否符合正则表达式
4. /正则表达式/.exec(str)，返回匹配结果的数组
表达式： / 正则表达式主体 / 修饰符(可选)
修饰符：i(对大小写不敏感)、g(查看所有匹配，而非找到第一个匹配后停止)、m(执行多行匹配)
表达式模式
1. 查找某范围内的字符：
  1. [abs]：查找方括号内的任何字符
  2. [0-9]：查找任何0~9的数字
  3. (x|y)：查找匹配任何以|分隔的选项的内容
2. 元字符
  1. \d：查找数字
  2. \s：查找空白字符
  3. \b：匹配单词边界
  4. \uxxx：查找十六进制数字xxx规定的Unicode字符
3. 量词
  1. n+：匹配任何包含至少一个n的字符串
  2. n*：匹配包含0个或多个n的字符串
  3. n?：匹配任何包含0个或1个n的字符串
变量提升
1. 函数和变量的声明都会提升到函数的最顶部
2. 变量可以先使用，再声明
3. 变量的初始化不能被提升var x = 5
JS的严格模式

在头部加上“use strict”，是ES5的内容
1. 不允许使用未声明的变量
2. 不允许删除对象/变量var x = 3; "use strict";delete x;
3. 不允许删除函数
4. 不允许变量重名
5. 不允许用转义符\
6. 不允许this指向全局对象
JS误区
1. 数组不能用名字作为索引
  
  javascript var arr = []; arr["aaa"] = "AAA"; arr["bbb"] = "BBB"; alert(arr.length); // 输出0 alert(arr[0]); // 输出undefined
  
  上面的数组被重定义为对象，只能用对象的方法来访问
  
  javascript for (var i in arr){ alert(i); // 输出每个arr的属性名 alert(arr[i]); // 输出每个arr的属性值 }
JS表单

获取表单某字段的值：document.forms["myForms"]["inputName"].value
JSON
1. JS对象
  
  javascript var person = { firstName:"John", lastName:"Doe", age:50, eyeColor:"blue" };
2. JSON数组：下面包括了三个对象
  
  javascript var text = {"person:[ {"firstName":"John","lastName":"Doe"}, {"firstName":"John1","lastName":"Doe1"}, {"firstName":"John2","lastName":"Doe2"} ]};
3. JSON字符串(这里将JSON数组用’ ’括起来，变成字符串)转对象
  
  javascript var text = '{ "sites" : [' + '{ "name":"Runoob" , "url":"www.runoob.com" },' + '{ "name":"Google" , "url":"www.google.com" },' + '{ "name":"Taobao" , "url":"www.taobao.com" } ]}'; // 转对象 var obj = JSON.parse(text); // 用对象的方法把JSON中的值取出来 alert(obj.sites[0].name);
javascript:void(0)可以定义死链接，放在a的href中

JS函数
自调用函数：

javascript (function(){ ... })();
Arguments对象

JS函数都有内置的函数对象Arguments，可以获取传入函数的参数数组

“`javascript
x = findMax(1, 123, 500, 115, 44, 88);

function findMax() {
alert(arguments[0]);// 输出1
return arguments[2];// 返回500
}
“`
函数调用
1. this关键字：指向函数执行的当前对象
2. 可以通过call或者apply来设置this的值
闭包：解决“若用全局变量，则所有脚本不通过调用函数，都可以改变该变量，不好”

是的函数拥有私有变量便变成可能

javascript var name = "The Window"; var forEach = function(){ name:"The Obj", getName:function(){ return function(){ return this.name; }; } }

JS HTML DOM
如需改变 HTML 元素的属性，请使用这个语法：

document.getElementById(id).attribute=新属性值
如需改变 HTML 元素的样式，请使用这个语法：

document.getElementById(id).style.property=新样式