锐客网

  1. 首页 > it技术 > >

Web前端页面设计基础-JavaScript基础

智能联想
创建一个无序列表，里面包含5项
UI>li5
创建一个2行2列的表格
div>table>(tr>td2)*2
javascript 是事件驱动的一门语言（要先有个事件触发他，然后js再去做相应的事情）
JavaScript的作用 1.可以实现网页间的动态效果
2.可以实现表单验证，减轻服务器压力。
JavaScript是对象和事件结合，触发一段代码。
JavaScript是脚本语言，与java不同，java属于编译语言，脚本语言不需要像java那样编译器，而直接可以运行在电脑上的程序，就叫脚本语言。而编译语言需要编译器编译成字节，再放在电脑上运行。
JavaScript的组成 ecmascript---全球的脚本语言标准
dom-document object model 文档模型
bom-brower object model
浏览器模式
网页中如何位置只要嵌入如下代码，就可以执行JavaScript脚本

javascript也可以缩写js
js中注释//
调用：var value=https://www.it610.com/article/aaa(3,14,5,6)
console.log(value1);
script标签可以写在header中，body中，body的下面都可以。
执行时机：首先要加载到网页中，并且被触发了，才执行。
document.write()向文档流中写入某些内容(向网页中打印内容)。
document 对象是js中最常见的对象，表示网页文档（空白区域）
js引入的三种方式
1.页内引入 直接写script脚本
2.外部链接 script src
3.行内引用 JavaScript：***（）；
通常可以写js给我们自带的一些方法。
js核心语法 js是一门弱型的编程语言，区别于java，java可以叫强类型的编程语言，区别：变量定义时不用指定数据类型，数组存储数据时，可以多种数据类型的值存在在一个数组中。
1.变量
--定义用var开头
--变量名规范同java
（先声明变量再赋值
例：var width；width=5；
同时声明和赋值变量
例：var catName=“皮皮”；var x,y,z=10;
不声明直接赋值
例：width=10；
变量可以不声明直接使用，但这种方法很容易出错，也很难查找排错，不推荐使用）
--js严格区分大小写，a A是两个变量。
var lowwer=shuzu[i].toLowerCase()转换成小写单词。
indexOf（）判断查找某个指定的字符串在字符串中首次出现的位置。
charAt（index）返回在指定位置的字符。
定以后，变量表示尚未初始化，是undefined的，只有给他赋值后，才能使用。
2.数据类型
number 数值型
NaN 非数值型 isNaN（）
boolean
Date
String
undefined
null
数组
对象类型
3.String类型的相关使用
4.typeof（）--判断返回某个变量的数据类型是什么
-undefined：变量被声明后，但未被赋值
例：var i;
-string：用单引号或双引号来声明的字符串
-boolean：true或false
-number：整数或浮点数
-object：JavaScript中的对象，数组和null
核心语法-数组 创建数组
var 数组名称=new Array（size）
数组常用属性和方法
属性：length设置或返回数组中元素的数目
方法：1.join（）把数组的所有元素放入一个字符串，通过一个分隔符进行分隔
2.sort（）对数组排序
if条件语句循环语句
Web前端页面设计基础-JavaScript基础
文章图片
图片.png
循环中断

Web前端页面设计基础-JavaScript基础
文章图片
图片.png 核心语法-常用的输入、输出 alert（“提示信息”）
prompt（“提示信息”，“输入框的默认信息”）
例：prompt（“请输入姓名”，“张三”）
prompt（“请输入姓名”）
核心语法
代码区分大小写
变量，对象和函数的名称
分号
调用函数
函数调用一般和表单元素的事件一起使用，调用格式：
事件名=“函数名（）”；
常用系统函数 parseInt(“字符串”)
将字符串转换为整型数字
如：parseInt（“86”）将字符串“86”转换为整型值86.
parseFloat（“字符串”）
将字符串转换为浮点型数字
isNaN（）用于检查其参数是否是非数字
自定义函数语法 function函数名（参数1，参数2，参数3...）{
//JavaScript语句；
【return返回值】
}
函数定义：函数没有返回值声明，函数里如果没有return，就是没有返回值，或者return

Web前端页面设计基础-JavaScript基础
文章图片
图片.png 函数入参，不能有var
没有入参，就没有返回值
函数的入参可以是函数
-自定义函数使用关键字function，调用函数常使用的格式：事件名=“函数名（）”；
所有从页面上收集上来的数都是字符串
parseInt字符串转整数
parseFloat字符串转小数
Number（“2”）--2，Number（“2.2”）--2.2，
Number（“2a”）--NaN，
eval（num1+operator+num2）将数字和字符串转换成正
常表达式运算而不是拼接
setTimeout("showDate()",1000) 入参1 函数名，入参
2 毫秒数
setTimeout（）延时一段时间再执行
setInterval（）每隔一段时间执行
showDate（）在页面上实时显示系统时间
js es5 变量的作用域分为两种，一种是函数级（var）
，一种是全局（不写var）
es6 let声明变量 块级作用域
总结： 【Web前端页面设计基础-JavaScript基础】-在HTML页面中引用JavaScript有三种方式
-常用的输入/输出是prompt（）和alert（）方法。
-常用的系统函数有parseInt(),parseFloat()和isNaN（）；

    推荐阅读


    上一篇：《六项精进》打卡

    下一篇：Golang(二)基本语法