JavaScript笔记

来源:互联网 发布:mysql设置最大连接数 编辑:程序博客网 时间:2024/06/07 14:18
JavaScript
简介
JavaScript
JavaScript 是互联网上最流行的脚本语言,这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
JavaScritp是一种轻量级的编程语言
JavaScritp是可插入HTML页面的编程代码
JavaScritp插入HTML页面后可由所有的现代浏览器执行
JavaScritp 很容易学习

数据类型
字符串(String)、数字(Number)、布尔(Boolean)、数组(Array)、对象(Object)、空(Null)、未定义(Undefined)。
var定义变量.
JavaScript不需要定义数据类型.

对象
对象也是一个变量,但对象可以包含多个值(多个变量)。
var car = "Fiat";
var car = {type:"Fiat", model:500, color:"white"};
函数
Function
函数是由事件驱动或者当他使用被调动时可重复使用的代码块儿
function functionname(){
代码块儿;
};
functionname():
带参数的函数
function functionname(var1,var2){
代码块儿;
};
functionname(var1,var2):
带有返回值得函数
function functionname(var1,var2){
 var3 = var1 + var 2;
return x;
};
var var4=functionname(var1,var2):
局部 JavaScript 变量
在 JavaScript 函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它。(该变量的作用域是局部的)。
全局 JavaScript 变量
在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。
系统常用函数
ocument 对象属性和方法
HTML文档中可以使用以上属性和方法:
属性 / 方法 描述
document.activeElement 返回当前获取焦点元素
document.addEventListener() 向文档添加句柄
document.adoptNode(node) 从另外一个文档返回 adapded 节点到当前文档。
document.anchors 返回对文档中所有 Anchor 对象的引用。
document.applets 返回对文档中所有 Applet 对象的引用。
document.baseURI 返回文档的绝对基础 URI
document.body 返回文档的body元素
document.close() 关闭用 document.open() 方法打开的输出流,并显示选定的数据。
document.cookie 设置或返回与当前文档有关的所有 cookie。
document.createAttribute() 创建一个属性节点
document.createComment() createComment() 方法可创建注释节点。
document.createDocumentFragment() 创建空的 DocumentFragment 对象,并返回此对象。
document.createElement() 创建元素节点。
document.createTextNode() 创建文本节点。
document.doctype 返回与文档相关的文档类型声明 (DTD)。
document.documentElement 返回文档的根节点
document.documentMode 返回用于通过浏览器渲染文档的模式
document.documentURI 设置或返回文档的位置
document.domain 返回当前文档的域名。
document.domConfig 返回normalizeDocument()被调用时所使用的配置
document.embeds 返回文档中所有嵌入的内容(embed)集合
document.forms 返回对文档中所有 Form 对象引用。
document. getElementsByClassName() 返回文档中所有指定类名的元素集合,作为 NodeList 对象。
document.getElementById() 返回对拥有指定 id 的第一个对象的引用。
document.getElementsByName() 返回带有指定名称的对象集合。
document.getElementsByTagName() 返回带有指定标签名的对象集合。
document.images 返回对文档中所有 Image 对象引用。
document.implementation 返回处理该文档的 DOMImplementation 对象。
document.importNode() 把一个节点从另一个文档复制到该文档以便应用。
document.inputEncoding 返回用于文档的编码方式(在解析时)。
document.lastModified 返回文档被最后修改的日期和时间。
document.links 返回对文档中所有 Area 和 Link 对象引用。
document.normalize() 删除空文本节点,并连接相邻节点
document.normalizeDocument() 删除空文本节点,并连接相邻节点的
document.open() 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。
document.querySelector() 返回文档中匹配指定的CSS选择器的第一元素
document.querySelectorAll() document.querySelectorAll() 是 HTML5中引入的新方法,返回文档中匹配的CSS选择器的所有元素节点列表
document.readyState 返回文档状态 (载入中……)
document.referrer 返回载入当前文档的文档的 URL。
document.removeEventListener() 移除文档中的事件句柄(由 addEventListener() 方法添加)
document.renameNode() 重命名元素或者属性节点。
document.scripts 返回页面中所有脚本的集合。
document.strictErrorChecking 设置或返回是否强制进行错误检查。
document.title 返回当前文档的标题。
document.URL 返回文档完整的URL
document.write() 向文档写 HTML 表达式 或 JavaScript 代码。
document.writeln() 等同于 write() 方法,不同的是在每个表达式之后写一个换行符。
事件
HTML 事件可以是浏览器行为,也可以是用户行为。
以下是 HTML 事件的实例:
HTML 页面完成加载
HTML input 字段改变时
HTML 按钮被点击
实例
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

<button onclick="getElementById('demo').innerHTML=Date()">现在的时间是?</button>
<p id="demo"></p>

</body>
</html>
常见的HTML事件
下面是一些常见的HTML事件的列表:
事件 描述
onchange HTML 元素改变
onclick 用户点击 HTML 元素
onmouseover 用户在一个HTML元素上移动鼠标
onmouseout 用户从一个HTML元素上移开鼠标
onkeydown 用户按下键盘按键
onload 浏览器已完成页面的加载

运算符
+ 加法x=y+2 75
- 减法 x=y-23 5
* 乘法 x=y*210
/ 除法 x=y/22.5
% 取模(余数) x=y%2
++ 自增 x=++y6
x=y++ 5 6
-- 自减 x=--y
x=y-- 5 4
= x=y x=5实例 »
+= x+=y x=x+y x=15 实例 »
-= x-=y x=x-y x=5 实例 »
*= x*=y x=x*y x=50 实例 »
/= x/=y x=x/y x=2 实例 »
%= x%=y x=x%y x=0
表单验证
JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。
表单数据经常需要使用 JavaScript 来验证其正确性:
验证表单数据是否为空?
验证输入是否是一个正确的email地址?
验证日期是否输入正确?
验证表单输入内容是否为数字型?
实例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<head>
<script>
function validateForm(){
var x=document.forms["myForm"]["fname"].value;
if (x==null || x==""){
  alert("姓必须填写");
  return false;
  }
}
</script>
</head>
<body>
<form name="myForm" action="demo-form.php" onsubmit="return validateForm()" method="post">
姓: <input type="text" name="fname">
<input type="submit" value="提交">
</form>
</body>

</html>

0 0
原创粉丝点击