js 概念 目的:用来向html添加交互行为 java和js无任何关系 组成部分:ecmascript dom bom 基本结构
<script>
JavaScript 语句;
</script >
网页引用js三种方式 数据类型 5个 1.undefined (未定义) var width; 变量width没有初始值,将被赋予值undefined 2.null (空) 表示一个空值,与undefined值相等 3.number (数字) 4.boolean true和false 5.String 一组被引号(单引号或双引号)括起来的文本 typeof运算符 js是一门弱语言 \1. undefined --未定义的变量或值 \2. boolean --布尔类型的变量或值 \3. string --字符串类型的变量或值 \4. number --数字类型的变量或值 \5. object --对象类型的变量或值,或者null(这 个是js历史遗留问题,将null作为object类型处理) \6. function--函数类型的变量或 js运算符 4个 算术运算符+ - * / % ++ -- 赋值运算符= += -= 比较运算符> < >= <= == != === !== 逻辑运算符&& || !
java和JavaScript的运算符唯一不同在于和= js流程控制语句
if条件语句
Switch多分支语句
For、while循环语句
For-in js数组 数组的三种定义方式 数组访问格式数组名下标 赋值数组数据 循环获取数据 数组的常用属性和方法 属性:length 设置或返回数组中元素的数目
join() 把数组的所有元素放入一个字符串,通过一个的分隔符进行分隔
push() 向数组末尾添加一个或更多 元素,并返回新的长度
sort() 对数组排序
java数组和JavaScript数组的区别:
java**:定义数组必须指定长度,而且长度确定下来之后无法改变。如果数组越界会报数组越界错误
ArrayIndexOutOfBoundsException 数组越界异常
js**:js中的数组长度是可变的,也没有强制要求必须定义长度。不会出现数组越界问题** 13.核心语法 循环中断 continue break 14.js函数 a.常见系统函数 5个 parseInt("") 将字符串转化成整数 parseFloat("") 将字符串转化成小数 isNaN() 检测参数是否是非数字 alert(“”)弹出框 prompt("");用于显示可提示用户进行输入的对话框
默认十进制,第二个参数为0也代表十进制。第二个参数可以是3进制,4进制.... 测试案例 b.自定义函数
语法:function 函数名(参数1,参数2...){
//JavaScript语句
[return 返回值];//返回值可有可无 } js事件 10个 单击事件:onclick 基本所有的标签都有单击事件 双击事件:ondbclick 改变事件:onchange 输入型的框、单选、多选、下拉(一般来说都是指定的标签元素的value值发生变化时会产生change事件) 获取焦点事件:onfocus 输入框 失去焦点事件:onblur 输入框 提交事件:onsubmit 只有from表单用 载入事件:onload 只有body用 onmouseout 鼠标从某元素移开 onmouseover 鼠标被移动到某元素 onkeydown 某个键盘按键被按下。
oninput 输入框值被改变事件 绑定事件 2种 onkeydown 事件event 冒泡事件 addeventlistener(1,2,3)事件
1: 必须。字符串,指定事件名。注意: 不要使用 "on" 前缀。 例如,使用 "click" ,而不是使用 "onclick"。
2: 必须。指定要事件触发时执行的函数
3: 可选。布尔值,指定事件是否在捕获或冒泡阶段执行。
true - 事件句柄在捕获阶段执行
false- false- 默认。事件句柄在冒泡阶段执行 捕获 冒泡 阻止冒泡事件 event.stopPropagation js的内置对象 string方法 属性 字符串对象length
charAt(index) 返回在指定位置的字符
indexOf(str index) 查找某个指定的字符串在字符串中首次出现的位置
substring(index1,index2)返回位于指定索引index1和index2之间的字符串,并且包括索引index1对应的字符,不包括索引index2对应的字符
split(str) 将字符串分割为字符串数组 date方法
getDate()返回一个月中的每一天,介于1-31之间
getDay()返回星期中的每一天,介于0-6之间
getHours()返回小时数,介于0-23之间
getMinutes()返回分钟数,0-59之间
getSeconds()返回秒数,0-59之间
getMonth()返回月份,0-11之间
getFullYear()返回年份,其值为4位数
getTime()返回某一时刻(1970,1,1)以来的毫秒数 tolocalestring math方法
Ceil() 对数进行上舍入
Floor()对数进行下舍入
Round()把数四舍五入为最接近的数
Random()返回0-1之间的随机数
js操作BOM对象
history 3个
back()加载列表中的前一个url
forward()加载列表的下一个url
get()加载列表中的某个具体的url
location
href设置或返回完整的url
reload()重新加载当前文档
注意 parent.localtion.href=""用整个页面跳转
document 4个函数
getElementById()返回对拥有指定id的第一个对象的引用
getElementsByName()返回带有指定名称的对象的集合
getElementsByTagName()返回带有指定标签名的对象的集合
Write()向文档写文本、html表达式或js代码
getElementsByClassName 返回相同class元素对象集合
获取和写入元素内容:
1.非表单:innerHTML
2.表单:value
测试以上三个get方法获取元素对象,使用innerHTML获取内容进行输出,或者使用innerHTML="属性"进行写入
案例 window对象的常用方法
Prompt()显示可提示用户输入的对话框
Alert()显示带有一个提示信息和一个确定按钮的警示框
Confirm()显示一个带有提示信息,确定和取消按钮的对话框
Close()关闭浏览器窗口
Open()打开一个新的浏览器窗口,加载给定URL所指定的文档
setTimeout()在指定的毫秒数后调用函数或计算表达式
setInterval()按照指定的周期(以毫秒计)来调用函数或表达式 循环函数 setInterval循环函数
setInterval("调用的函数",间隔的毫秒数) 每隔1秒(1000毫秒)执行函数一次 clearInterval停止函数 定时函数 setTimeout("函数","毫秒")在多少毫秒后只执行一次
clearTimeout(setTimeOut()返回的值) DOM对象 节点的属性 parentNode 返回节点的父节点 chlidNodes返回子节点集合 firstChild返回第一个子节点,最普遍的用法是访问该元素的文本节点 lastChild返回最后一个子节点 nextSibling下一个节点 previousSibling上一个节点 firstElementChild 返回节点的第一个子节点,最普遍的用法是访问该元素的文本节点 lastElementChild 返回节点的最后一个子节点 nextElementSibling 下一个节点 previousElementSibling 上一个节点
测试以上每个节点属性,一般使用element系列的属性获取节点,因为会忽略空格文本的子节点 3.节点信息 nodeName节点名称 nodeValue节点值 但一般用innerHTML nodeType节点类型 节点类型 element元素 attr属性 text文本 comments注释 document文档 4.操作节点属性 getAttribute("属性名") setArribute("属性名","属性值") 创建和插入节点 creatElement(tagName) 创建一个标签名为tagName的新元素节点 A.appendChild(B) 把B节点追加至A节点的末尾 insertBefore(A,B) 把A节点插入到B节点之前 删除和替换节点 removeChild(node) 删除指定的节点 replaceChild(newNode,oldNode)属性 attr 用其他的节点替换指定的节点 style设置css样式