JS入门
2023-03-28 19:59:34 0 举报AI智能生成
登录查看完整内容
JS极速入门
作者其他创作
大纲/内容
var 变量名 = new Array(元素列表);//方式一
var 变量名 = [元素列表];//方式二
定义
arr[索引] = 值;
访问
设置或返回数组中元素的数量
length
属性
遍历数组中的每个有值的元素，并调用一次传入的函数
forEach()
将新元素添加到数组的末尾，并返回新的长度
push()
从数组中删除元素
splice()
方法
是用来简化函数定义语法的。具体形式为：(...) => {...}
arr.forEach((e) => { console.log(e); })
箭头函数(ES6)
Array
var 变量名 = new String(\"...\");//方式一
创建对象
字符串的长度
返回在指定位置的字符
charAt()
检索字符串
indexOf()
去除字符串两边的空格
trim()
提取字符串中两个指定的索引号之间的字符(含头不含尾)
substring()
String
JS自定义对象
对象名.属性名;对象名.函数名();
自定义对象的调用格式
var 变量名 = '{\"key1\
var jsObject = JSON.parse(userStr);
JSON字符串转为JS对象
var jsonStr = JSON.stringify(jsObject);
JS对象转为JSON字符串
数字（整数或浮点数）
字符串（在双引号中）
逻辑值（true 或 false）
数组（在方括号中）
对象（在花括号中）
null
value的数据类型
JSON
Window：浏览器窗口对象
Navigator：浏览器对象
Screen：屏幕对象
History：历史记录对象
Location：地址对象
组成
直接使用window，其中 window. 可以省略
window.alert(\"Hello Window\");alert(\"Hello Window\");
获取：
history
location
navigator
属性：
显示带有一段消息和一个确认按钮的警告框
alert()
显示带有一段消息以及确认按钮和取消按钮的对话框
confirm()
按照指定的周期（以毫秒计）来调用函数或计算表达式
setInterval()
在指定的毫秒数后调用函数或计算表达式
setTimeout()
方法：
Window
使用 window.location 获取，其中 window. 可以省略
window.location.属性;location.属性;
location.href = \"https://www.itcast.cn\";
href：设置或返回完整的URL
BOM(浏览器对象模型)
Document：整个文档对象
Element：元素对象
Attribute：属性对象
Text：文本对象
Comment：注释对象
Core DOM - 所有文档类型的标准模型
XML DOM - XML 文档的标准模型
Image：<img>
Button：<input type = 'button'>
HTML DOM - HTML 文档的标准模型
定义了访问HTML和XML文档的标准
var h1 = document.getElementById('h1');
根据id属性值获取，返回单个Element对象
var divs = document.getElementsByTagName('div');
根据标签名获取，返回Element对象数组
var hobbys = document.getElementsByName('hobby');
根据name属性值获取，返回Element对象数组
var clss = document.getElementsByClassName('cls');
根据class属性值获取，返回Element对象数组
获取Element元素对象
DOM(文档对象模型)
js对象
将JS代码定义在HTML页面中
内部脚本
将JS代码定义在外部JS文件中，然后引入到HTML页面中
外部脚本
js引入方式
通过 function 关键字进行定义
形式参数不需要类型，因为JavaScript是弱类型语言
返回值也不需要定义类型，可以在函数内部直接使用return返回即可
JS中，函数调用可以传递任意个数的参数
注意
js函数
大部分同Java相同，结尾分号可有可无
书写语法
使用 window.alert() 写入警告框
使用document.write()写入 HTML 输出
使用 console.log 写入浏览器控制台
输出语句
使用 var 关键字声明变量
组成字符可以是任何字母、数字、下划线（_）或美元符号（$）
数字不能开头
建议使用驼峰命名
遵守规则：
ECMAScript 6 新增了 let 关键字来定义变量。它的用法类似于 var，但是所声明的变了，只在 let 关键字所在的代码块内有效，且不允许重复声明
ECMAScript 6 新增了 const 关键字，用来声明一个只读的常量。一旦声明，常量的值就不能改变
注意：
变量
number
string
boolean
undefined
原始类型
引用类型
使用运算符 typeof 可以获取数据类型
数据类型
+，-，*，/，%，++，--
算术运算符
=，+=，-=，*=，/=，%=
赋值运算符
注意：==会进行类型转换，===不会进行类型转换
>，<，>=，<=，!=，==，===
比较运算符
&&，||，！
逻辑运算符
条件表达式？true_value : false_value
三元运算符
运算符
if...else if...else
switch
for
while
do...while
语法与java类似，详情参考官方文档：https://www.w3school.com.cn/js/js_statements.asp
流程控制语句
js基础语法
<input type=\"button\" onclick=\"on()\" value=\"按钮1\"><script> function on(){ alert('我被点击了！'); }</script>
方式一：通过 HTML 标签中的事件属性进行绑定
<input type=\"button\" id=\"btn\" value=\"按钮2\"><script> document.getElementById('btn').onclick=function(){ alert('我被点击了！'); }</script>
方式二：通过 DOM 元素属性绑定
事件绑定
鼠标单击事件
onclick
元素失去焦点
onblur
元素获得焦点
onfocus
某个页面或图像
onload
当表单提交时触发该事件
onsubmit
某个键盘的键被按下
onkeydown
鼠标被移到某元素之上
onmouseover
鼠标从某元素移开
onmouseout
常见事件
js事件监听
1- js引入方式2- js基础语法3- js函数4- js对象5- js事件监听
JavaScript入门
0 条评论
回复 删除
下一页
