1JavaScript是一种基于对象和事件驱动的脚本语言,它提供了一些专有的类、对象及函数 基本数据类型JavaScript提供了4种基本的数据类型用来处理数字和文字 Number、String、Null、Boolean 变量 ...
1
JavaScript是一种基于对象和事件驱动的脚本语言,
它提供了一些专有的类、对象及函数
基本数据类型
JavaScript提供了4种基本的数据类型用来处理数字和文字
Number、String、Null、Boolean
变量
语法:
var 变量名=值;
变量命名规范:
1)变量名由字母、数字、下划线和$组成
2)变量名的首字母必须是字母、$或下划线
3)不能使用JavaScript 保留字,注意区分大小写
类型转换
parseInt (String)
将字符串转换为整型数字
parseFloat(String)
将字符串转换为浮点型数字
运算符
算术运算符
+、-、 * 、 / 、%、++、--
比较运算符
==、!=、>、>=、<、<=
逻辑运算符
&&、||、!
注释
JavaScript 注释有两种
单行注释
语法://注释内容
多行注释
语法:/*注释内容*/
流程控制语句
语法:
if条件语句
switch多分支语句
for、while、do…while循环语句
break 和 continue 语句
break 语句来中断一个循环的运行。
continue 语句用来跳过余下的代码块而直接转到下一次循环继续执行
函数的定义与调用
函数声明语法:
function 函数名 (参数列表)
{
函数代码块;
return 表达式;
}
函数调用语法:
函数名(实参1,实参2…) ;
var 变量名=函数名(实参1,实参2…);
变量的作用域
根据变量的作用范围,JavaScript中的变量可以分为全局变量和局部变量
事件处理
浏览器事件
onload、unonload、onsubmit
鼠标事件
onMouseMove、onMouseOver、onMouseOut、onMouseDown、onMouseUp
文本框事件
onchange、onselect、onfocus、onblur、
其他
onclick
2
浏览器对象模型
浏览器对象模型是用于描述对象与对象之间层次关系的模型,该对象模型提供了独立于
内容的、可以与浏览器窗口进行互动的对象结构
浏览器对象的分层结构
window对象
常用属性
常用方法
window属性和方法事例
var money=prompt("请输入取款金额",100);//接收用户录入对话框
alert(money);//输出100
var state=confirm("你取款金额为"+money);//确认和取消按钮对话框
alert(state);//返回true或false
setTimeout(“调用的函数”,”毫秒数”)
window.open("adv.html","","相关属性");
height: 窗口高度;
width: 窗口宽度;
top: 窗口距离屏幕上方的象素值;
left:窗口距离屏幕左侧的象素值;
toolbar: 是否显示工具栏,yes为显示;
menubar,scrollbars 表示菜单栏和滚动栏。
resizable: 是否允许改变窗口大小,yes或1为允许
location: 是否显示地址栏,yes或1为允许
status:是否显示状态栏内的信息,yes或1为允许;
history对象
作用:
history对象用来管理当前窗口最近访问过的URL
常用方法:
注意:
history.go(-1) 相当于 history.back()
history.go(1) 相当于 history.forward()
例子:
<a href="javascript:history.back()">后退</a>
相当于
<a href="javascript:history.go(-1)">后退</a>
<a href="javascript:history.forward()">前进</a>
相当于
<a href="javascript:history.go(1)">后退</a>
location对象
作用:
location对象用来管理当前打开窗口的URL信息
常用属性和方法:
例子:
window.location.href=”http://www.baidu.com”;
DOM概述
DOM-Document Object Model ,它是W3C国际组织的一套Web标准
DOM是一种与浏览器、平台、语言无关的接口
document对象
作用:
document对象代表浏览器窗口中加载的整个HTML文档
常用属性:
常用方法:
document对象访问页面元素的常用方式有四种
1)document.all.页面元素名称;
3)document.表单名.元素名称;
3)document.getElementById("ID名称");
4)document.getElementsByName("元素名称");
----------------------------------------------------------------------------------------
属性示例:开灯关灯
1、
<script type="text/javascript">
function setColor_()
{
var type =document.getElementById("setColor").value;
if(type=="关灯")
{
document.getElementById("setColor").value="开灯";
document.bgColor="black";
}else
{
document.getElementById("setColor").value="关灯";
document.bgColor="white";
}
}
</script>
2、
<input
type="button"
value="关灯"
id="setColor"
onclick="setColor_()"
name="setColor"/>
属性示例:图片广告随滚动条滚动而滚动
核心代码如下:
1、
<script type="text/javascript">
function move()
{
document.getElementById("adv").style.top=400+document.documentElement.scrollTop+"px";
}
window.onscroll=move;
</script>
2、
<img src='/images/loading.gif' data-original="足够大的背景图片" />
<div
id="adv"
><img src='/images/loading.gif' data-original="需要漂浮的小广告图片"/></div>
方法示例:全选操作
核心代码如下:
1、
<script type="text/javascript">
function isChecked(state)
{
var v=document.getElementsByName("lover");
for(var i=0;i<v.length;i++)
{
if(v[i].type=="checkbox")
{
v[i].checked=state;
}
}
}
</script>
2、
<input type="radio" name="ischeck" onclick="isChecked(true)" />全选<input type="radio" name="ischeck" onclick="isChecked(false)"/>全否<br />
<a href="javascript:isChecked(true)">全选</a>
<a href="javascript:isChecked(false)">全否</a>
<hr />
<input type="checkbox" id="lover" name="lover"/>体育
<input type="checkbox" id="lover"name="lover"/>音乐
<input type="checkbox" id="lover" name="lover"/>美术
节点信息
document文档对象可以创建、添加、删除DOM支持的任何类型的节点
1、 使用document.createElement创建节点
document.createElement的功能是创建一个指定标签名的元素节点,标签名可以是任
何名字,包括自定义的标签
2、使用appendChild(node)将节点追加到所有子节点的末尾
3、使用insertBefore(newNode,node)将节点newNode插入到节点node之前
4、使用removeChild删除节点
innerHTML属性
innerHTML是DOM节点的一个属性,它表示节点的开始标签与结标签之间的内容
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:JS知识点
关键词:JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。