javaScript学习(入门)
不落俗套的来讲讲javascript的特点:
1.所有主流浏览器都是支持javascript的。
2.绝大部分网页都使用javascript。
3.javascript可以实现网页呈现各种动态效果。
4.简单易学,只要有文本编辑器,就可以编写javascript程序。
作为测试,了解一些开发技能是很有必要的。。。总之,不要安于做一个只会点点点的测试小菜
开始学习吧...
-----------------------------------------------------------------------------------------------------------------------------------------------------
在网页中加入JS代码的方式是使用成对的<scrpit>标签,如下:
<script type="text/javascript">
document.write("hello");
</script>
其中:首标签的type="text/javascript"表示告诉浏览器里面的文本是属于javascript语言。
PS:除了直接在html文件中编写javascript代码外,还有一种方式是将html文件与JS代码分开,并单独创建一个javascript文件(后缀为.js,简称JS文件)(注意:在JS文件中,不需要<script>标签,直接写JavaScript代码就可以了。JS文件不能直接运行,需要嵌入到HTML文件中执行,在HTML添加代码:<script src="script.js"></script>)。
例如:html文件
JS文件:
---------------------------------------------------------------------------------------------------------------------------------------------
关于JS在页面中的位置:
javascript作为一种脚本语言可以放在html页面中任何位置,而浏览器解释HTML是有先后顺序的,所以前面的script就先被执行。
一般会将javascript代码放在网页的head或者body部分,放在head部分浏览器解析head部分就会执行这个javascript代码;放在body部分,javascript代码在网页读取到该语句的时候就会执行。所以进行页面初始化的js必须放在head里面,因为初始化都要提前进行,而通过事件调用执行的function对位置就没有任何要求了。
关于添加注释:单行注释,在注释内容前加符号"//";多行注释以"/*"开始,以"*/"结束。
关于变量:JS定义变量的语法:var 变量名 (PS:变量是使用任意多个英文字母、数字、下划线或者美元符$组成,其中数字不能为首;不能使用JavaScript关键字及保留字;变量需要先声明再赋值且变量可以重复复制。)
注意:在JS中区分大小写
--------------------------------------------------------------------------------------------------------------------------------------------------
语法学习:
一:判断语句:if...else
语法:
if(条件)
{条件成立时执行的代码}
else
{条件不成立时执行的代码}
二: 函数
语法:
function 函数名()
{
函数代码;
}
PS:函数定义好后,是不能自动执行的,需要调用才能被执行。
例如:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>函数调用</title>
<script type="text/script">
function contxt()
{
alert("哈哈,调用函数了!");
}
</script>
</head>
<body>
<form>
<input type="button" value="点击我" onclick="contxt()" />
</form>
</body>
</html>
三:输出内容document.write()
使用情况一:document.write("I love javascript!");//内容直接用双引号括起来,双引号内容直接输出。
使用情况二:var mystr="hello world!"; document.write(mystr); //输出变量存储的内容。
使用情况三:var mystr="hello"; document.write(mystr+"I love javascript");//输出多项内容,内容之间用+号连接
使用情况四:var mystr="hello"; document.write(mystr+"<br>"); document.write("javascript");
四:JS中输出空格
在写JS代码的时候,无论咋输出的内推中什么位置有多少个空格,显示的结果只有一个空格,因为浏览器显示机制就是:对于手动悄然的空格,将连续多个空格显示成一个空格。
如:document.write(" 1 2 3"); 结果为:1 2 3
解决办法一:使用html的 具体为:document.write(" "+"1"+" "+"2");
解决方法二:使用CSS样式来解决 具体为:document.write("<span style='white-space:pre;'>"+"1 2 3 "+"</span>");
white-space:pre这个样式表示:空白会被浏览器保留。
五:警告:alert消息对话框
语法:alert(字符串或变量);
PS:特点:在点击对话框“确定”前不能进行任何其他操作,消息对话框一般可用于调试程序,其输出内容可以是字符串或变量与document相似。
六:确认:confirm消息对话框(包括一个确定按钮和一个取消按钮)
语法:confirm(str); 补充:str表示在消息对话框中要显示的文本,返回值为布尔型,点击“确定”,返回true;点击“取消”,返回false
例如:
<script type="text/javascript">
var mymessage=confirm("你喜欢互联网行业吗?");
if(mymessage==true)
{ document.write("很好,加油!"); }
else
{ document.write("现在是网络信息化社会,生活无处不网络哦!"); }
</script>
七:提问:prompt消息对话框 (弹出消息对话框,包含一个缺点按钮、取消按钮与一个文本输入框)
语法:prompt(str1,str2); //补充:str1表示要显示在消息对话框中的文本,不可修改;str2表示文本框中的内容,可以修改。反击确定按钮,文本框中的内容将作为函数返回值,点击取消按钮,将返回NULL
例如:
var myname=prompt("请输入你的姓名:");
if(myname!=null)
{ alert("你好"+myname); }
else
{ alert("你好 my friend."); }
八:打开新窗口:window.open()
语法:window.open([URL],[窗口名称],[参数字符串])
参数说明:[]表示参数可选
URL:在窗口中要显示网页的网址或路径,若省略这个参数,或者它的值是空字符串,那么窗口就不显示任何文档。
窗口名称:被打开窗口的名称。有字母、数字和下划线组成,其中“_top"(框架网页中在上部窗口中显示目标网页)、"_blank"(在新窗口显示目标网页)、"_self"(在当前窗口显示目标网页)是具有特殊意义的名称。另外,相同name的窗口只能创建一个,name不能包含有空格。
参数字符串:设置窗口参数,各参数用逗号隔开。
参数表如下:
例如:打开http://www.baidu.com网站,大小为300px*200px,无菜单,无工具栏,无状态栏,有滚动条窗口:
<script type="text/javascript">
window.open('http://www.baidu.com','_blank','width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes')
</script>
注意:运行的时候要考虑兼容性。
九:关闭窗口(window.close)
window.close();//关闭本窗口 <窗口对象>.close();//关闭指定的窗口
例如:var mywin=window.open("http://www.baidu.com"); mywin.close(); //注意,该段代码在打开窗口的同事关闭该窗口,故看不到被打开的窗口。
javaScript学习(入门)的更多相关文章
- JavaScript学习基础篇【第1篇】: JavaScript 入门
JavaScript 快速入门 JavaScript代码可以直接嵌在网页的任何地方,不过通常我们都把JavaScript代码放到<head>中,由<script>...< ...
- 每天成长一点---WEB前端学习入门笔记
WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...
- Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”
Web编程基础--HTML.CSS.JavaScript 学习之课程作业"仿360极速浏览器新标签页" 背景: 作为一个中专网站建设出身,之前总是做静态的HTML+CSS+DIV没 ...
- HTMl5/CSS3/Javascript 学习推荐资源
HTMl5/CSS3/Javascript 学习推荐资源 前端的定义应该是数据内容的展示,在国内大家都觉得前端只是HTML+CSS+Javascript,但是实际上与展示有关的都是前端,所以Ruby/ ...
- 第一百一十九节,JavaScript事件入门
JavaScript事件入门 学习要点: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操 ...
- javascript学习-目录
Javascript学习 第1章 Javascript简介 1.1 Javascript简史 1.2 Javascript实现 1.3 Javascript版本 第2章 Javascript入门 2. ...
- JavaScript 学习推荐
主要是个人的学习网站,书籍推荐,还有个人学习经历,以及一些学习经验或技巧 JavaScript学习网站推荐 如果想快速入门,这些是很推荐的网站 快速入门,很快能让你了解前端,有什么,做什么, ...
- Javascript闭包入门(译文)
前言 总括 :这篇文章使用有效的javascript代码向程序员们解释了闭包,大牛和功能型程序员请自行忽略. 译者 :文章写在2006年,可直到翻译的21小时之前作者还在完善这篇文章,在Stackov ...
- OPEN(SAP) UI5 学习入门系列之一:扫盲与热身(下)
1 UI5代码结构 上一次我们一起用了20秒的时间完成一个UI5版的Hello World.应用打开后有一个按钮,按钮的文字是Hello World,点击这个按钮之后,按钮会慢慢的消失掉(Fade o ...
- Javascript之入门篇(一)
上一篇学习了什么是JavaScript语言及其作用和特有的特点等,本篇将详细介绍JavaScript一些入门使用方式. 对于初学者来讲,由于JavaScript是嵌入到HTML页面里面的,首先创建一张 ...
随机推荐
- nodejs的第三天学习笔记
一. CommonJS 规范 1.1nodejs 与 commonjs 之间的关系: 1)nodejs是一种服务器语言. a)开启服务的能力 b)文件读写的能力 服务器:就是一台安装了服务软件 2)c ...
- native vlan(本征VLAN)
其实就是不打tag的VLAN,因为你想,一个VLAN在经过交换设备老是打tag,然后再脱掉tag...这个很浪费计算资源,尤其是在转发的报文量相当大的时候. 如何解决: 可以定义一种vlan, ...
- 【第1期】腾讯云的1001种玩法征集,Ipad mini和Kindle 等你拿!(文章评审中)
版权声明:本文由阁主的小跟班原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/695994001482226944 来源:腾云 ...
- 【安全测试】sqlmap安装方法
参考资料:http://jingyan.baidu.com/article/60ccbceb64cc2064cbb19748.html SQLMap是利用Python语言写的,所以需要将Python这 ...
- Sprint1(第一天11.14)
Sprint1第一阶段 1.类名:软件工程-第一阶段 2.时间:11.14-11.23 3.选题内容:web版-餐厅到店点餐系统 4.团队博客地址: http://www.cnblogs.com/qu ...
- 十天精通CSS3学习笔记 part1
http://www.imooc.com/learn/33 第1章 初识CSS3 什么是CSS3? CSS3是CSS2的升级版本,3只是版本号,它在CSS2.1的基础上增加了很多强大的新功能. 目前主 ...
- winform项目打包成可安装程序(vs2015)
1.新建安装和部署项目 如果是初始使用并且原来没有下载过,会被所引导一个下载界面http://learn.flexerasoftware.com/content/IS-EVAL-Instal ...
- CSS轮廓outline
http://www.cnblogs.com/xiaohuochai/p/5277416.html
- MySQL数据库的备份与还原
http://www.cnblogs.com/lql123/p/6090681.html //安装WordPress 1.备份 密码为:AAAzzz//123 mysqldump -uroot ...
- Python:dict用法
dict全称dictionary,使用键-值(key-value)存储,有极快的查找速度. 以下整理几种常用的dict用法 定义 空dict >>> dict={} 普通dict & ...