JavaScript 基础知识

来源：互联网发布：淘宝网店图片处理软件编辑：程序博客网时间：2024/06/05 12:39

1.1 基本概念

HTML负责呈现什么内容，CSS负责以何种方式来呈现。

HTML+CSS：实现了静态页面。

实际上，我们更多的页面的要求是动态的，比方说新浪网

一些轮播图的切换，tab选项卡的切换，时间也应该是动态显示的。还有验证码、注册页面的数据验证…那么怎么才能让页面动起来呢？

答案就是JavaScript！

1.2 简介

JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。

javaScript是脚本语言：

JavaScript 是一种轻量级的编程语言。

JavaScript 是可插入 HTML 页面的编程代码。

JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。

JavaScript 很容易学习。

1.3 JavaScript的用法

HTML 中的脚本必须位于 <script> 与 </script> 标签之间。脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。

<script>标签：

如需在 HTML 页面中插入 JavaScript，请使用 <script> 标签。

<script>    alert("我的第一个 JavaScript");</script>

您无需理解上面的代码。只需明白，浏览器会解释并执行位于 <script> 和 </script>之间的 JavaScript 代码。

那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript"。现在已经不必这样做了。JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。

1.4 <body> 中的 JavaScript

在本例中，JavaScript 会在页面加载时向 HTML 的 <body> 写文本：

实例：<!DOCTYPE html><html><body>..<script>document.write("<h1>这是一个标题</h1>");document.write("<p>这是一个段落</p>");</script>..</body></html>

1.5 JavaScript的两种引用方式

（1）内部引用，也就是上面所说的，在<script>标签中使用。

（2）外部引用，<script src="E103-01-03.js"></script>。

JavaScript的注释方式：（1）单行注释：//注释内容（2）多行注释：/*注释内容*/

JS是一种解释型语言

计算机语言分为编译型和解释型

程序员使用高级语言编制程序，但是程序最终是由计算机去执行，那么计算机只能执行机器语言（即二进制代码），那么这个过程就必然有一个从高级语言到机器语言的“翻译”过程。

有两种“翻译”方式：

（1）编译：将代码整体翻译成机器代码，如果有错误则停止翻译，全部成功翻译完才能执行；

（2）解释：将代码翻译一条马上执行一条，如果遇到错误则停止。

1.6 JavaScript输出

JavaScript 没有任何打印或者输出的函数。

JavaScript 可以通过不同的方式来输出数据：

使用 window.alert() 弹出警告框。使用 document.write() 方法将内容写到 HTML 文档中。使用 innerHTML 写入到 HTML 元素。使用 console.log() 写入到浏览器的控制台。

（1）使用window.alert():你可以弹出警告框来显示数据。

实例：<!DOCTYPE html><html><body><h1>我的第一个页面</h1><p>我的第一个段落。</p><script>window.alert(5 + 6);</script></body></html>

（2）操作html元素：如需从JavaScript中访问html元素，可以使用document.getElementById(id)访问，使用id属性来标识html元素，并用innerHTML来获取或插入元素内容。

实例：<!DOCTYPE html><html><body><h1>我的第一个 Web 页面</h1><p id="demo">我的第一个段落</p><script>document.getElementById("demo").innerHTML = "段落已修改。";</script></body></html>

以上 JavaScript 语句（在 <script> 标签中）可以在 web 浏览器中执行：

document.getElementById("demo") 是使用 id 属性来查找 HTML 元素的 JavaScript 代码。

innerHTML = "Paragraph changed." 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。

阅读全文

0 0