上一讲我们学了javascript出现在何处,看起来象什么。现在我们开始学习这种语言。本课我们将学习javascript如何存储信息,如何根据信息作决定,如何根据用户交互要求交替图片
准备好了吗? 现在开始学习电脑编程基础。 第一讲, 变量。
如果你学过代数,你一定见过变量。如果没学过也不要紧。变量是javascript存储信息的简单方式。例如,当你写:"x=2," "x"是一个变量,它存储值为2。如果而后你又说"y=x+3,","y"将具有值“5”
这里是一个使用变量的javascript例子。
在本例中我们一步一步浏览源码 你将看到:
这里没什么新鲜的,是一个javascript片的结束。
这是该例中头文件中javascript的全部,当javascript执行这些代码时,上述变量将被定义。但此时这些变量尚未做任何事,这是在该例主体中要完成的事。
现在我们已经定义了变量,让我们用它来做一些事。
标签之间,必须用document.writeln("blah!")在网页中写html引号中的字符显现出来;引号外的字符被认为是变量。
注意在第一和第三行中,引号中的是我们想要显现的,而secs_per_year无引号。因此javascript认为它是变量并交换成变量值。幸好,在头文件中我们定义了secs_per_year是一大数,因此可被显现,否则javascript将报错。
引号中的任何字都被称为字符串,javascript不编译它。
本例中使用的是双引号("),也可使用单引号('),二者可互换。若第二行中的是
document.writeln("secs_per_year"),javascript
将直接将secs_per_year显现,而不是31,536,000.
本例和字符的区别很重要,因此在我们继续下去之前,保证你已读懂了这段。
你可以用document.writeln() 写html语言。
注意第一和第三行的 和 标签。
这即是该例的概要。我们常见的一个问题是:“通常什么出现在头文件中,什么出现在主体文件中?”
一般这关系不大。好的习惯是把大多数javascript放在页面的头上。这是因为比主体要先读到,所以出现在主体中的变量(如secs_per_min)都在头中定义了。当secs_per_min在javascript试图执行document.writeln(secs_per_min)命令后定义则javascript会报错。
好,现在我们准备作一个关于变量的练习,但首先再注意一下字符串。
如前一节所提,引号间的字符都称为字符串,无论单双引号。就如变量可为数字一样,它也可为字符串。因此可说:
var nice_monkey = "the monkey smiles at you and recites shakespeare.";
var bad_monkey = "the monkey scowls at you and burps.";
声明变量时即给变量赋值,使它等于这些字符串,于是当你想写这些字符串时,你可写:
document.writeln(nice_monkey);
这里是可用字符串做事的例子。
仔细看一看源码,你将常会发现一些新鲜,有趣的事。
看以下新鲜之处:
var monkey = prompt("what's the monkey's name?", "the monkey");
这里我们称为用户反馈提示方式,当它被调用时,启动一个对话框请求用户输入信息。用户完成后敲ok返回信息。在上行中返回信息放入其变量中。
注意该提示方式有两个变量,且都是字符串。第一个在对话框输入区上面显示,本例中它是:“what's the monkey's name?”。本例中第二个参数"the monkey",放置输入框的缺省值。如果你不想要缺省值,则在第二个参数加上引号,就象这样:
var monkey = prompt("what's the monkey's name?", "");
下一行是直接变量分配,就象此前我们看到的:
var techy_monkey = monkey + demanding + tech;
该行介绍了一个字符串操作器:累加标记。当两个字符串间出现累加标记时,则这两个变量出现在同一字符串中,这称为“连锁”。于是上行创造了一个新的变量称为techy_monkey含有包含上述三个变量的字符串。换一句话说,其结果即是"the monkey" + "demands, no, insists upon receiving" + "a computer that won't crash, and a homemade browser!"
var techy_monkey = monkey + demanding + tech;
于是也可说:
var techy_monkey = "the monkey demands, no, insists upon receiving a computer that won't crash, and a homemade browser!";
下面一段显示更多的使用字符串的诀窍。其工作原理是相同的,我们只看三行:
var italic_hippy = hippy_monkey.italics();
var shouting_hippy= hippy_monkey.touppercase();
var red_bold_tech = bold_tech.fontcolor('red');
第一行是说:“使该字符串包含变量以斜体显示”,这实际上即是:
var italic_hippy = "" + hippy_monkey + "";
但看起来要好的多!今后在javascript写document.writeln(italic_hippy)时,你得到的是斜体显示的字符。
下一行讲述的技巧是在html中实现不了的,它使得hippy_monkey中所有字符以大写显示
第三行显示改变字符串属性的例子。。所有的字符具有颜色,你可用string.fontcolor('new color');命令改变其颜色。也可这样作:
var red_bold_tech = "" + bold_tech + "";
但它阅读起来不如这样容易:
var red_bold_tech = bold_tech.fontcolor('red');
本例中除本行外你还可看到其他的应用:
document.writeln(bold_tech + "
");
它除替代显示一字符串外,还连接两个字符串然后显示结果。也可写成两行,象这样:
var broken_bold = bold_tech + "
";
document.writeln(broken_bold);
但这要创建另一个变量,并不必要的写另一行。
现在我们已学习了所有的关于变量和字符串知识,请做一个练习
当你完成该工作后,该开始if子句练习了。
"if"子句的应用可以使得程序根据用户输入的值作出不同的反应。例如你可以写一段程序使得它对你与对其他人反应不同。这里是它的基本格式:
if (some condition is true)
{
do something;
do something;
do something;
}
本结构的重要部分:
以单词 "if"开始 (if 必须小写).
圆括弧中是条件:非真即伪。
如果条件为真的话执行花括弧中的语句。
记住:空格是唯一保持程序可读性的东西。当然你可以将整个if语句写在一行中,但它读起来就费劲了。
这里是一个if子句的例子。
如果你在即时对话框中键入yes,你将收到一个亲切的问候。若敲入别的则没有。
这里是该语句的核心:
var monkey_love = prompt("你喜欢网猴吗?","敲入是或否。");
if (monkey_love == "是")
{
alert("谢谢!很高兴您能来这儿!请往下读吧!");
}
第一行你见过。它唤起一个对话框并将用户的反馈调入变量monkey_love中。但第二行就有些不同:它有个条件,即如果变量monkey_love等于值"是" ,则运行花括号中的语句。若它等于其他值,则不运行。
注意该条件中的两个等于标记,这是人们容易搞混的地方之一。如果你只用一个标记,实际上是告诉javascript测试是否monkey_love等于 "是"。幸运的是,多数浏览器在你运行这些语句时会识别这些错误并警告你。但最好现在开始就注意别犯这种错误。
其他重要的条件是:
(variable_1 > variable_2) is true if variable_1 is greater than variable_2
(variable_1 (variable_2 (variable_1 != variable_2) is true if variable_1 does not equal variable_2
有两个方法可使你的条件更合理:
在运行花括号中的语句前如果你想要两件事为“是”,可这样做:
if ((variable_1 > 18) && (variable_1 {
document.writeln("variable_1 can vote, but can't drink.");
}
注意这里的两个“&&”在javascript中这是“与”的意思。也注意整个子句有两个部分,&&须在圆括号中。
若想两件事之一为真,这样做:
if ((variable_1 == "bananas") || (variable_1 == "javascript"))
{
document.writeln("the monkey is happy because it has " + variable_1);
}
回到if练习中来!
一旦用户点击一个链结,或将鼠标移到其上,javascript发送一个链结事件。一种链结事件叫做onclick, 当用户点击它时才发送。另一种叫onmouseover,用户将鼠标移到上面时即发送。
你可用这些事件来影响用户所见。
第一个有趣的事情是没有
现在来复习一下今天所学到的。
变量
变量值可为数字或字符串。命名变量时它有一些限制和规律需记住。
语句
语句以半圆括号结束。
字符串
字符串是引号标记中的做法序列,引号可是单引号,也可是双引号。可用字符串作许多奇妙之事。你可用”+“来连接两个字符串。
document.writeln()
可用document.writeln() 来写文本和网页中的html。
prompt
你可用prompt来得到用户的输入反馈。
if--else
可用if--else子句使你的javascript依不同的用户反应给予不同的表现。
链接事件
在一个href中的onclick和onmouseover可基于用户反应运行javascript。
图片变换
图片命名后,可用javascript改变所显示的图片。
如果你感到你已经全部掌握了上面我们所讲的,那么祝贺你!
还有许多东西要学。下一次,我们要切入javascript的心脏: 文档对象模型,我们也将学到如何打开并操作窗口和frames , 并开始建造我们自己的新的浏览器。
0
0
相关文章
JavaScript 弹出画廊:实现页面加载时默认显示首张图片
优化JavaScript弹窗画廊:实现页面加载时自动展示首张大图
优化JavaScript弹出画廊:页面加载时自动展示首图
无需JavaScript,仅用CSS实现表格单元格背景色条件渲染
动态级联选择框实现:基于用户首选值预设与动态更新
java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!
本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门AI工具
相关专题
本专题汇总了抖音网页版的入口链接、官方登录页面以及视频观看入口,帮助用户快速访问抖音网页版,提供免登录访问方式和直接进入视频播放页面的方法,确保顺利浏览和观看抖音视频。
63
2026.02.04
本专题详细汇总了学习通网页版入口与登录方法,提供学习通官方网页端入口、学生登录平台、网页版使用指南等内容,帮助用户快速稳定地登录学习通官网,顺利进入学习平台,提升学习效率和体验。
9
2026.02.04
本专题系统讲解 Python Django 框架的核心功能与进阶开发技巧,包括 Django 项目结构、数据库模型与迁移、视图与模板渲染、表单与认证管理、RESTful API 开发、Django 中间件与缓存优化、部署与性能调优。通过实战案例,帮助学习者掌握 使用 Django 快速构建功能全面的 Web 应用与全栈开发能力。
9
2026.02.04
本专题专注讲解 Java 在流式数据处理与消息队列系统中的应用,系统讲解 Apache Kafka 的基础概念、生产者与消费者模型、Kafka Streams 与 KSQL 流式处理框架、实时数据分析与监控,结合实际业务场景,帮助开发者构建 高吞吐量、低延迟的实时数据流管道,实现高效的数据流转与处理。
3
2026.02.04
本专题深入讲解 Golang 应用的容器化与 Docker 部署,涵盖 Docker 基础概念、容器构建与镜像管理、Go 应用的 Dockerfile 编写、跨平台容器部署与优化、Docker Compose 和 Kubernetes 部署工具。通过实际案例,帮助学习者掌握 如何将 Golang 应用容器化并实现高效部署与管理,提升系统的可扩展性与运维效率。
3
2026.02.04
热门下载
相关下载
精品课程
共12课时 | 0.6万人学习
共12课时 | 1.0万人学习
共1课时 | 0.3万人学习




