学习前端的第三周

学习前端的第三周

1.使用控制台进行调试：控制台可用来检测在js中输入的指令是否成功运行。可通过控制台来调试html中的js指令。

2.js的数据类型：String（字符串），number，布尔（boolean），空（Null）,object(对象)，数组（Array）,函数（Function），Date（日期），正则（RegExp）。

3.字符串的拼接 innerHTML= "字符串"+6+"字符串"（已经定义过的可以不用引号，如果需要加空格或其他字符可以使用+”字符“+ 的模式）

4.js函数使用模板：

<script> function myFunction(p1, p2) { return p1 * p2; } document.getElementById("demo").innerHTML = myFunction(7, 8); </script>（也可以拆开对函数定义部分可以移入js中写）

5.类的概念：类分为两部分（"属性"+"行为"），类包含所定义对象的所有属性及其行为。例如定义一辆车，类包含其车牌号型号座位数等等以及其可以实现的功能（前进后退等等）。

6.DOM操作及其监听：dom相当于类，旗下的HTML相当于dom定义的对象（个人理解）。

DOM操作：其可以通过鼠标点击而改变文字（非按钮），为网页增加动画效果，使网页活起来，更加生动有趣，也增加了网页与用户之间的互动。

DOM监听：1.element（监听的对象）.addEventListener(event（事件类型）, function（）, useCapture);

2.removeEventListener() 方法

removeEventListener() 方法会删除已通过 addEventListener() 方法附加的事件处理程序：

总之其可以监听查看用户对所在页面的缩放以及点击按钮情况等等进行监听。

7.BOM （浏览器对象模型，允许js与浏览器进行对话）

（1）类的思想 ： BOM-window-document-html-js,css;

（2）显示window窗口大小

​

​

<script> var w = window.innerWidth

var h = window.innerHeight

var x = document.getElementById("demo"); x.innerHTML = "浏览器内窗宽度：" + w + "，高度：" + h + "。"; </script>

（3）`screen.内容：可用来显示以像素计的屏幕高度宽度以及可用宽度等。

（4）Window Location

window.location 对象可不带 window 前缀书写。

一些例子：

• window.location.href 返回当前页面的 href (URL)

• window.location.hostname 返回 web 主机的域名

• window.location.pathname 返回当前页面的路径或文件名

• window.location.protocol 返回使用的 web 协议（http: 或 https:）

• window.location.assign 加载新文档

  （5）

  • history.back() - 等同于在浏览器点击后退按钮

  • history.forward() - 等同于在浏览器中点击前进按钮

其通过函数实现其作用

（6）警示框：alert();

确认框：confirm（运用if else语句）

提示框 prompt需要用户输入内容；

8.typeof 内容 可以用来返回内容的数据类型。

9.脚本语言：脚本是用来修饰html的，可以给HTML添加动画特效以及一些其他的细节内容。