前言:
接下来我将会先带领大家学习JavaScript入门的五个课程;
有兴趣了解更多的同学可以添加我的一个联系方式(下方);
QQ:2508598490;邮箱:2508598490; 私人微信:zhouenda888
JavaScript本次课程目录
- 第一章:JavaScript简介
- 第二章:JavaScript用法
- 第三章:JavaScript输出
- 第四章:JavaScript注释
- 第五章:JavaScript变量
第一章:JavaScript简介
- JavaScript 是互联网上最流行的脚本语言;
- 这门语言可用于 HTML 和 web;
- 更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
- JavaScript 是一门脚本编程语言;
- JavaScript 是一种轻量级的编程语言。
- JavaScript 是可嵌入HTML页面的编程代码。
- JavaScript 插入 HTML 页面后,可由所有的现代浏览器运行(调试);
- JavaScript 通俗易懂;
第二章:JavaScript用法
以下知识点!知识点!知识点!知识点!知识点!知识点!
HTML 中的脚本必须位于 标签之间。 脚本可被放置在 HTML 页面的 和 部分中;
script 标签
如需在 HTML 页面中插入 JavaScript,请使用 script标签。
script和 /script 会告诉 JavaScript 在何处开始和结束。
script 和 /script 之间的代码行包含了 JavaScript;
<script>
alert("我的第一个 JavaScript");
</script>
以上是内部使用办法
<script src="myScript.js"></script>
以上外部引用办法
那么他们有什么区别呢?
- 内部适合代码量较小的业务环境;
- 外部适合复杂的业务环境;
- 内部可以随意放位置
- 外部最好统一放在head里面
第三章:JavaScript输出;
JavaScript 没有任何打印或者输出的函数;
JavaScript 可以通过不同的方式来输出数据:
- 使用 window.alert() 弹出警告框;
- 使用 document.write() 方法将内容写到 HTML 文档中;
- 使用 innerHTML 写入到 HTML 元素;
- 使用 console.log() 写入到浏览器的控制台。
使用 window.alert()
你可以弹出警告框来显示数据,常用于提示用户未进行某项操作,例如没有输入密码等!
<!DOCTYPE html>
<html>
<body>
<script>
window.alert('四维教育欢迎您!');
</script>
</body>
</html>
以上实例通过了浏览器的警告框输出了以下结果
四维教育欢迎您!
操作 HTML 元素
如需从 JavaScript 访问某个 HTML 元素,您可以使用document.getElementById(id) 方法,请使用"id" 属性来标识 HTML 元素,并 innerHTML 来获取或插入元素内容:
<!DOCTYPE html>
<html>
<body>
<h1>操作html元素</h1>
<p id="demo">四维教育</p>
<script>
document.getElementById("demo").innerHTML = "四维教育欢迎您!";
</script>
</body>
</html>
以上方法适用于叠加其它知识去使用,这个方法可以通过JavaScript渲染html元素;
写到 HTML 文档
出于测试目的,您可以将JavaScript直接写在HTML文档中:
<!DOCTYPE html>
<html>
<body>
<script>
document.write(Date());
//输出当前时间;
</script>
</body>
</html>
document.write() 仅仅向文档输出写内容。 如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖。
写到控制台
如果您的浏览器支持调试,你可以使用 console.log() 方法在浏览器中显示 JavaScript 值,浏览器中使用 F12 来启用调试模式, 在调试窗口中点击"Console" 菜单。
<!DOCTYPE html>
<html>
<body>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
程序中调试是测试,查找及减少bug(错误)的过程。
第四章:JavaScript注释
注释的目的是为了让方便方便代码的修改优化也提升了代码的规范
行注释:
//我是行注释
//我也是
行注释仅仅注释当前行如果行注释后面有代码应该放置在代码后面或者换行写在代码的上方或下方,否则将会导致该行代码无法执行;
块注释
/*
我是块注释
document.getElementById("myH1").innerHTML="欢迎来到我的主页";
document.getElementById("myP").innerHTML="这是我的第一个段落。";
我是块注释
*/
用块注释可以阻止代码块的执行(多用于调试)
JavaScript变量
变量是用于存储信息的"容器"。
var x=5;
var y=6;
var z=x+y;
就像代数那样
x=5
y=6
z=x+y
在代数中,我们使用字母(比如 x)来保存值(比如 5)。
通过上面的表达式 z=x+y,我们能够计算出 z 的值为 11。
在 JavaScript 中,这些字母被称为变量。
您可以把变量看做存储数据的容器
与代数一样,JavaScript 变量可用于存放值(比如 x=5)和表达式(比如 z=x+y)。
变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume)。
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
- 变量名称对大小写敏感(y 和 Y 是不同的变量)
JavaScript数据类型
JavaScript 变量还能保存其他数据类型,比如文本值 (name=“Bill Gates”)。
在 JavaScript 中,类似 “Bill Gates” 这样一条文本被称为字符串。
JavaScript 变量有很多种类型,但是现在,我们只关注数字和字符串。
当您向变量分配文本值时,应该用双引号或单引号包围这个值。
当您向变量赋的值是数值时,不要使用引号。如果您用引号包围数值,该值会被作为文本来处理。
var pi=3.14;
var person="John Doe";
var answer='Yes I am!';
声明(创建)变量
var demo = '我是变量';
本次课程到此结束,如有任何意见请通过邮箱的方式向我提出!
制作不易希望大家能够点个赞,谢谢!