JavaScript初探(一)

原创 2017年01月23日 02:59:35

JavaScrip是一种动态类型直译脚本语言,内置支持类型,其解释器被称为JavaScript引擎,内置于所有浏览器中;


HTML中嵌入JS的意义在于:

实现如切换的字、滚动条等动态效果等

相应浏览器事件,自适应窗口变大变小等

验证表单输入,常见如两次密码输入是否一致,输入时间是否小于当前日期

两种引用script的方式

<html>
<head>
<!--内部嵌入方式-->
<script>
function hello()
{
	document.getElementById("message").innerHTML = "Hello world of JS:";
}
</script>
<!--外部引用方式-->
<script src="myjs.js"></script>
</head>

<body>
<div id="message"> </div>
<button type="button" onclick="hello();"> Try it </button>
</body>
</html>


基本语法:

--语句

区分大小写,语句以;结尾,用{}表示作用域,用/* */进行注释

--变量及数据类型

js采用动态数据类型,变量的类型随着值得变化而变化,变量用关键字var进行声明

	var arr = new arry()
	var obj = {language="english",title="python programming"}
	obj["language"] = "xxx"
	obj.language = "xxx"

--操作符

+ - * / % == >= <= ++ --

--函数

	function functionname(parm1,..parmn)
	{
	block of function code
	//Return xxx
	}
--判断语句

	if (condition1)
	{
		block;
	}
	else if(condition2)
	{
		block;
	}
	else
	{
	}


	switch(expression)
	{
	case value 1:
		block;
		break;
	case value n:
		block;
		break;
	}
--循环语句

	for (var i=0;i<100;i++)
	{
		document.write("<br>");
	}
	for (x in array)
	{
		block of loop;
	}
	while(expression)
	{
		block of loop;
	}
	do
	{
		block of loop;
	}while(expression)

DOM及其读写:

DOM是当网页被加载时浏览器创建的页面文档对象模型document object model, DOM用结构化的方式描述了标记语言的文件内容,JavaScript中几乎所有有意义的行为都是围绕DOM展开的,HTML DOM被构建为树结构,通过操作DOM树结构,js可以增、删、改、查HTML标记的元素、内容、属性、样式等,同时DOM提供了一系列支持 JavaScript 遍历和修改DOM的方法


--查找节点

get.ElementById(id) 返回拥有指定id的第一个应用对象

getElementsByName(name) 返回带有指定名称的对象集合

getElementsByTagName(tagName) 返回带有指定标签名的对象集合

obj.childNodes 获得子节点的节点列表

obj.firstChild 获得节点的第一个子节点

obj.lastChild 获得节点的最后一个子节点

obj.nextSibling 获得节点之后的第一个兄弟节点

obj.parentNode 获得节点的父及诶单

obj.previousSibling 获得节点之前的第一个兄弟节点

--增加节点

document.createElement()

obj.appendChild()

obj.insertBefore()

obj.replaceChild()

--删除节点

obj.removeChild()

--修改属性节点<div id="container">

obj.getAttribute("class)

obj.setAttribute("class","normal")

--访问及修改节点的内容

oldcontent = obj.innerHTML

obj.innerHTML = "xxx"



版权声明:本文为博主原创文章,未经博主允许不得转载。

javascript初探四

选项卡、简易日历选项卡 Document #div1 .active{ background: yellow; } #div1 div{...

初探JavaScript一

鼠标、函数、隐藏显示、换肤、提示框鼠标操作 onmouseover鼠标移入显示 onmouseout鼠标移出显示 Document #div1 { ...

函数式编程初探(Javascript)

最近学习函数式编程,对于其中“没有副作用的函数”感觉最为深刻,这样的函数测试起来不受外界环境影响,实在是以后写程序的一个指导方向 使用Javascript进行实验主要还是编写和调试方便,本文代码都在C...
  • cylon
  • cylon
  • 2014年02月15日 17:15
  • 344

javascript设计模式初探--单例模式

一、什么是单例模式: Ensure a class only has one instance, and provide a global point of access to it.,即 “保证一个...

初探 JavaScript 中的函数式编程

一、什么是函数式编程? 函数式编程(Functional programming)简称 FP,并不是什么库或者框架,与过程式编程(Procedural programming)相对,而是一种...

cocos2D-x初探学习笔记(32)-cocos2d-x & javascript跨平台初体验

近日,cocos2d家族开始了版本的联合发布,也就是说从cocos2d-x的2.1版本开始,终于可以实现广大开发者期盼已久的一套代码横跨ios,android和html5的梦想了,这次联合发布的包括c...
  • bill_man
  • bill_man
  • 2013年02月14日 01:33
  • 24470

初探Javascript模块化开发

随着简单网页逐渐变成交互复杂的网站应用,网页上的Javascript代码也变得越来越庞大,越来越复杂。加之随即而来的多人协作分工的开发方式,每个人只负责其中一个或者几个很小的功能模块,最终必须通过把各...

JavaScript初探二

函数参数传递- 函数类似,只有单个变量 固定不变的部分代码: Document #div1 { width: 200px; heigh...

JavaScript初探三

提取行间事件 Document #div1 { width: 200px; height: 200px; border:...

cocos2D-x初探学习笔记(32)-cocos2d-x & javascript跨平台初体验

近日,cocos2d家族开始了版本的联合发布,也就是说从cocos2d-x的2.1版本开始,终于可以实现广大开发者期盼已久的一套代码横跨ios,android和html5的梦想了,这次联合发布的包括c...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JavaScript初探(一)
举报原因:
原因补充:

(最多只允许输入30个字)