JavaScript
关注
分享
扫一扫
文章平均质量分 94
学习笔记以及错误回顾
Aitting
一个普普通通的小程序猿
展开
-
JavaScript的DOM渲染原理
一、浏览器如何渲染网页概述：浏览器渲染一共有五步处理 HTML 并构建 DOM 树。处理 CSS构建 CSSOM 树。将 DOM 与 CSSOM 合并成一个渲染树。根据渲染树来布局，计算每个节点的位置。调用 GPU 绘制，合成图层，显示在屏幕上第四步和第五步是最耗时的部分，这两步合起来，就是我们通常所说的渲染具体如下图过程如下图所示image.pngimage.png渲染网页生成的时候，至少会渲染一次在用户访问的过程中，还会不断重新渲染重新渲染需要重复之前的第四转载 2021-05-08 17:38:21 · 2252 阅读 · 0 评论 -
js学习day13
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } /* * 设置outer的样式 */ #outer{ /*设置宽和高*/ width:原创 2020-07-14 20:51:28 · 122 阅读 · 0 评论 -
js学习day12
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /* * BOM * - 浏览器对象模型 * - BOM可以使我们通过JS来操作浏览器 * - 在BOM中为我们提供了一组对象，用来完成对浏览器的操作原创 2020-07-14 20:48:04 · 132 阅读 · 0 评论 -
js学习day11
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> window.onload = function(){ var u1 = document.getElementById("u1"); //点击按钮以后添加超原创 2020-07-14 20:47:26 · 88 阅读 · 0 评论 -
js学习day10
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box1{ width: 100px; height: 100px; background-color: red; } </style> <s原创 2020-07-14 20:22:25 · 131 阅读 · 0 评论 -
js学习day09
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> var str = prompt("请输出任意的内容:"); //var arr = str.split(""); //arr.reverse(); /原创 2020-07-14 20:21:53 · 426 阅读 · 0 评论 -
js学习day08
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function fun(a,b) { console.log("a = "+a); console.log("b = "+b); //alert(this); }原创 2020-07-14 20:13:30 · 119 阅读 · 0 评论 -
js学习day07
复习<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /*alert("hello"); function fun(){ a = 10; }*/ var obj = { sa原创 2020-07-08 16:05:42 · 144 阅读 · 0 评论 -
js学习day06
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /* * 创建一个函数，用来计算三个数的和 * * 可以使用 return 来设置函数的返回值 * 语法： * return 值 *原创 2020-07-07 23:54:40 · 116 阅读 · 0 评论 -
js学习day04
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 条件分支语句也叫switch语句 * 语法： * switch(条件表达式){ * case 表达式: * 语句...原创 2020-07-07 23:32:20 · 179 阅读 · 0 评论 -
js学习day05
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /* 通过程序，在页面中输出如下的图形： * 1 <1 i=0 ** 2 <2 i=1原创 2020-07-07 23:31:58 · 106 阅读 · 0 评论 -
js学习day03
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * JS中为我们提供了三种逻辑运算符 * ! 非 * - !可以用来对一个值进行非运算 * - 所谓非运算就是值对一个布尔值进行取反操作， *原创 2020-07-07 17:13:42 · 115 阅读 · 0 评论 -
js学习day02
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> /* * 数据类型指的就是字面量的类型 * 在JS中一共有六种数据类型 * String 字符串 * Number 数值 * Bool原创 2020-07-07 16:48:09 · 100 阅读 · 0 评论 -
js学习day1
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <!--script标签之中还有几个属性 例如 可选） src 异步脚本 async ..原创 2020-07-07 14:11:23 · 154 阅读 · 0 评论