- 博客(55)
- 收藏
- 关注
RSS订阅原创 第三章 语言基础
变量var 关键字var声明会自动提升到函数定义域顶部。反复多次使用var声明同一个变量没有问题。var在全局变量声明，会成为windows对象的属性。let 声明let声明的范围是块作用域。let声明的变量不会在作用域中被提升。在let声明之前的执行瞬间被称为“暂时性死区”，在此阶段引用任何后面才声明的变量都会抛出ReferenceError。条件声明的作用域在if块内。let在全局作用域声明，不会成为window对象的属性。在for循环中使用let声明，可以避免执行超时逻辑时
2020-12-28 11:57:13
137
原创 JavaScript for...in 循环
<script>var txt = "";var person = {fname:"Bill", lname:"Gates", age:62}; var x;for (x in person) { txt += person[x] + " ";}document.getElementById("demo").innerHTML = txt;</script>输出结果：Bill Gates 62
2020-12-27 10:49:24
116
原创 JS中if语句何时认为条件的求值是false
以下是几种情况：if(null) {console.log("123")} else {console.log("2222")}//2222if(undefined) {console.log("123")} else {console.log("2222")}//2222if(0) {console.log("123")} else {console.log("2222")}//2222if(-0) {console.log("123")} else {console.log("2222")}//
2020-12-23 18:51:10
279
原创 :hover和onmouseover、onmouseout
两者一个是用过css达到效果，一个是通过js达到效果。需要灵活使用。若是使用css是这样的<style> tr:hover { font-weight: bold; }</style>如果使用JS是这样的function highlightRows() { if(!document.getElementsByTagName) return false; var rows = document.getElementsByTagName("tr");
2020-12-23 17:05:49
197
原创 JS中数组的特点
很多编程元素支持命名索引的数组。具有命名索引的数组被称为关联数组（或散列）。JavaScript 不支持命名索引的数组。在 JavaScript 中，数组只能使用数字索引。假如使用命名索引，JavaScript 会把数组重定义为标准对象。之后，所有数组的方法和属性将产生非正确结果。var person = [];person["firstName"] = "Bill";person["lastName"] = "Gates";person["age"] = 62;var x = pers
2020-12-23 14:00:01
164
原创 使用webpack时遇到Module not found
完整的报错是：Module not found: Error: Can’t resolve ‘a.js’ in ‘D:\programming\trywebpack’我解决的方法是，添加配置文件：webpack.config.js配置文件内容为：module.exports = { entry: "./a", output: { filename: "pack.js", path: __dirname, },};三项的意思是：入口、出口、路径。__dirname表
2020-12-22 08:26:49
790
1
原创 函数定义后直接调用
(function () { window.msg = "Yo.";})();这里的最后一对括号是函数运算符，运算左边一对括号内的匿名函数。
2020-12-21 21:01:19
440
原创 js使用try，catch，throw
先上代码：<!DOCTYPE html><html><head><meta charset="utf-8"><title>菜鸟教程(runoob.com)</title></head><body><p>请输入 5 和 10 之间的一个数:</p><input id="demo" type="text"><button type="button" o
2020-12-18 11:23:24
501
原创 day34-36 一种使用innerHTML增加内容的方法
代码如下：outerHTML这个属性和innerHTML差不多，前者还额外设置（或获取）对象的标签。
2020-12-17 20:13:05
368
原创 day34-36属性选择器
当元素里没有id和class，且不能通过元素直接找到怎么办？用属性选择器！示例代码：<!DOCTYPE html><html><head><style>a[target=_blank]{background-color:yellow;}</style></head><body><p>target="_blank" 的链接会得到黄色背景：</p><a href="
2020-12-17 18:56:38
68
原创 day34-36 善用字符串拼接
我第一次看到这个代码还以为是写错了，是因为我有思维定式代码如下：qiu.style.transform = "translate("+x+"px,"+y+"px)";我的思维定式是，使用style.属性后，内容要被引号包围，但实际上并不是这样的，使用引号只是为了录入字符串，当需要录入变量时，用字符串的拼接即可。我把等号后面的引号的逻辑关系看错了，以为第一个括号和最后一个括号是一对。...
2020-12-17 17:05:43
78
原创 day34-36在XML中的五个实体引用
如果把字符 “<” 放在 XML 元素中，会发生错误，这是因为解析器会把它当作新元素的开始：<message>if salary < 1000 then</message>为了避免这个错误，要用实体引用来代替 “<” 字符：<message>if salary < 1000 then</message> 在 XML 中，有 5 个预定义的实体引用：< <> >&a
2020-12-16 14:59:18
75
原创 day31-33 对于e.target的使用要小心
对于onclick事件，每一次的e.target所获得的对象取决于onclick的地方。与变量不同。实例代码：<html> <body> <div id="region-radio-wrapper"></div> <div id="product-radio-wrapper"></div> <div id="table-wrapper"></div> <script&
2020-12-15 17:42:40
253
原创 day31-33阻止默认事件的方法
代码如下： var input = document.querySelector("input"); input.onclick = function (e) { if (input.checked == false) { e.preventDefault(); } };这样的话，checkbox就无法取消了。因为当checked的值想要变成false时，input的默认事件，即“改变checkbox的状态”这个默认
2020-12-14 18:16:33
436
原创 day31-33 关于点击事件内的判断语句
如果点击了一个checkbox，判断语句的判断是根据点击后的情况判断的：举个例子： if (input.checked == true) { console.log("123"); }在这里，当按钮按下后，如果是选中状态，则输出123...
2020-12-14 17:45:55
202
原创 day31-33 :nth-child和:nth-of-type的区别
区别不大。以为p为子元素为例。p:nth-child(n) p的父元素的第n个子元素p:nth-of-type p的父元素的第n个p元素
2020-12-14 17:07:43
83
原创 day31-33关于parentNode,parentElement,childNodes,children
找节点和找元素是不同的。childNodes和children区别在于，childNodes可能会找到文本节点，而children只会找到元素节点。parentNode和parentElement区别在于，存在document的节点，而不存在document元素。
2020-12-14 17:00:44
109
原创 day31-33关于自定义属性和修改属性
以input标签为例子input = document.querySelector("input");input.type = "checkbox";//在DOM中，也在标签中。input.hhhhhhh = "xxxxxx";//在DOM中，不在标签中，因为他不是内建属性。input.setAttribute("zzzzz","checkbox");//不管是否是内建属性，都会出现在标签中。所以，在修改内建属性时，为了方便，直接用点语法就行。在创建和修改自定义属性时，用setAttribut
2020-12-14 16:09:00
121
原创 day22-24 二叉树
放一个二叉树的例子<html> <body> <script> var tree = { id: 0, name: "root", left: { id: 1, name: "Simon", left: { id: 3, name: "Carl", left: {
2020-12-13 18:45:32
79
原创 day28-30使用querySelectorAll和for遍历
代码如下： for (i = 0; i < tips.length; i++) { var li = document.querySelectorAll("li"); }另外提一下，使用for循环的死后，第二个参数中若存在变量，可能会由于for循环的改变而改变，无法达到预期。因此最好不要直接在第二个变量里写参数，而是要在第一个参数里定义一个新变量，再把新变量写到第二个参数里，以保证for循环执行条件不变。...
2020-12-12 19:26:20
317
原创 day28-30（focus、select、children、keycode）
document.querySelector(“input”).focus();焦点作用于某对象document.querySelector(“input”).select();全选输入框中的内容ul.children.length ul的子节点的个数i = i.replace(/\s+/g, “”);去掉空格input.oninput = function (e) {e != 40 && e.keyCode != 13) { //如果按的不是上下及回车，重置选中状态
2020-12-12 19:11:50
83
原创 day28-30 复习事件代理
很简单的啦，我把代码放在这里啦：ul.onclick = function (e) { if (e.target.nodeName.toLowerCase() == "li") { hideTips(); var source = e.target; var liContent = source.textContent; input.value = liContent; }};
2020-12-11 10:57:57
63
原创 day28-30复习关系选择器
关系选择器是指根据与其他元素的关系选择元素的选择器，常见的符号有空格、>、~，还 有+等，这些都是非常常用的选择器。后代选择器：选择所有合乎规则的后代元素。空格连接。相邻后代选择器：仅仅选择合乎规则的儿子元素，孙子、重孙元素忽略，因此又称“子选择器”。>连接。适用于 IE7 以上版本。兄弟选择器：选择当前元素后面的所有合乎规则的兄弟元素。~连接。适用于 IE7 以上 版本。相邻兄弟选择器：仅仅选择当前元素相邻的那个合乎规则的兄弟元素。+连接。适用于 IE7 以上版本。...
2020-12-09 10:48:58
69
原创 day28-30 关于addEventListener
有的事件要用addEventListener添加，比如keypress。如果用.keypress可能不行。
2020-12-08 08:28:58
69
原创 day25-27完成了两个时钟
学习时间：3h尽量利用了函数的封装<html> <body> <div></div> <div class="second"></div> <script> var div1 = document.querySelector("div"); var today = new Date(); var day = today.getDay(); fun
2020-12-06 10:42:10
77
原创 day25-27 递归和setTimeout
递归程序调用自身的编程技巧称为递归（ recursion）。递归做为一种算法在程序设计语言中广泛应用。 一个过程或函数在其定义或说明中有直接或间接调用自身的一种方法，它通常把一个大型复杂的问题层层转化为一个与原问题相似的规模较小的问题来求解，递归策略只需少量的程序就可描述出解题过程所需要的多次重复计算，大大地减少了程序的代码量。递归的能力在于用有限的语句来定义对象的无限集合。一般来说，递归需要有边界条件、递归前进段和递归返回段。当边界条件不满足时，递归前进；当边界条件满足时，递归返回。使用setTime
2020-12-05 11:07:30
398
原创 day25-27 数组的一种构造方法
<html> <body> <script type="text/javascript"> var d = new Date(); var weekday = new Array(7); weekday[0] = "星期日"; weekday[1] = "星期一"; weekday[2] = "星期二"; weekday[3] = "星期三"; weekday[4] = "星期
2020-12-05 10:11:54
74
原创 day22-24 又犯了个错
找了半天才找到这个错误所以发上来公开处刑一下吧。<html> <body> <script> //对象到数组 var scoreObject = { Tony: { Math: 95, English: 79, Music: 68, }, Simon: { Math: 100, Engl
2020-12-04 11:04:40
58
原创 day22-24 对非 ASCII 字符排序
对非 ASCII 字符排序当排序非 ASCII 字符的字符串（如包含类似 e, é, è, a, ä 等字符的字符串）。一些非英语语言的字符串需要使用 String.localeCompare。这个函数可以将函数排序到正确的顺序。var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];items.sort(function (a, b) { return a.localeCompare(b);});
2020-12-04 10:09:39
68
原创 day22-24 初见函数的中的=＞
var numbers = [4, 2, 5, 1, 3];numbers.sort(function(a, b) { return a - b;});console.log(numbers);也可以写成：var numbers = [4, 2, 5, 1, 3]; numbers.sort((a, b) => a - b); console.log(numbers);也就是说numbers.sort(function(a, b) { return a - b;});
2020-12-04 10:04:23
78
原创 day22-24 sort()方法
语法：arr.sort([compareFunction])如果指明了 compareFunction ，那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素：如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前；如果 compareFunction(a, b) 等于 0 ， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）；
2020-12-04 09:53:32
121
原创 day22-24 对象、属性和方法
对象、属性和方法。对于如下对象：var person = { firstName: "Bill", lastName : "Gates", id : 678, fullName : function() { return this.firstName + " " + this.lastName; }};冒号前时属性名，冒号后是属性值方法是作为属性来存储的函数。访问对象属性两种方法：1.objectName.propertyName2.objec
2020-12-03 14:34:51
98
原创 day22-24 一些方法和算法的笔记（关于正则表达式）
判断按钮是否被选中：lab1.checked == true判断内容是否为数字： if (parseFloat(int1.value).toString() == "NaN") { p.textContent = "不是数字"; } else { p.textContent = "是数字"; }...
2020-12-02 10:55:29
67
原创 Number对象和Math对象
他们都有属性和方法。使用方法时，用法不同。对于Number对象：要对Number对象的变量使用方法（注意number首字母大写）创建 Number 对象有三种办法：var x = 1;//直接定义变量，并用数值类型赋值var myNum = new Number(value);//通过Number方法强制类型转换，可以是字符串或数字var myNum = Number(value);//通过new关键字创建Number类型的实例第一种多方便呜呜呜。例如：let x = 1;x.toS
2020-12-02 10:03:27
167
原创 day22-24 八进制和十六进制
如果前缀为 0，则 JavaScript 会把数值常量解释为八进制数，如果前缀为 0 和 “x”，则解释为十六进制数。var y=0377;//255var z=0xFF;//255
2020-12-02 09:24:03
189
原创 day22-24 var和let的区别
var可以变量提升：即先写一个变量再声明也可以重复声明：同一个变量声明多次都不会报错，但这么做代码会看起来很乱。let避免了这个问题，所以建议使用let声明变量
2020-12-02 09:19:34
87
原创 day22-24一些笔记
科学计数法的用法：var y = 123e5; // 12300000var z = 123e-5; // 0.00123JS对象有点向python里的字典。var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};对于Undefinedvar person; // 值是 undefined，类型是 undefined对于空值v.
2020-12-01 17:48:27
67
原创 day20-21浅谈CSS Sprite
什么是css sprite？将图标、背景、按钮背景等图片合并成一张图，然后通过坐标来定位背景。这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。简而言之：一背景图图多用。具体看这个：https://blog.csdn.net/u011349149/article/details/24181675可以用sprite实现圆角但我不想这么做，太麻烦了，用css3新增的属性radius多方便。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTM
2020-11-29 20:05:08
63
原创 day20-21使用opacity制作渐变
对于淡入有两种方法：一、利用法<html> <body> <div id="fade-obj" style="width: 300px; height: 300px; background: #000" ></div> <button id="fade-btn">淡出</button> <script> let div = document.quer
2020-11-29 16:35:27
320
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人