JS 简介


JavaScript 是世界上最流行的编程语言。

这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。


avaScript 是脚本语言

  • JavaScript 是一种轻量级的编程语言。
  • JavaScript 是可插入 HTML 页面的编程代码。
  • JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
  • JavaScript 很容易学习。

JavaScript:写入 HTML 输出

document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");

您只能在 HTML 输出中使用 document.write。如果您在文档加载后使用该方法,会覆盖整个文档。


JavaScript:对事件作出反应

<button type="button" onclick="alert('Welcome!')">点击这里</button>

alert() 函数在 JavaScript 中并不常用,但它对于代码测试非常方便。


JavaScript:改变 HTML 内容

使用 JavaScript 来处理 HTML 内容是非常强大的功能。

x=document.getElementById("demo")  //查找元素
x.innerHTML="Hello JavaScript"; //改变内容

您会经常看到 document.getElementByID("some id")。这个方法是 HTML DOM 中定义的。

DOM(文档对象模型)是用以访问 HTML 元素的正式 W3C 标准。

<!DOCTYPE html>
<html>
<body> <h1>我的第一段 JavaScript</h1> <p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p> <script>
function myFunction()
{
x=document.getElementById("demo"); // 找到元素
x.innerHTML="Hello JavaScript!"; // 改变内容
}
</script> <button type="button" onclick="myFunction()">点击这里</button> </body>
</html>
<!DOCTYPE html>
<html>
<body> <h1>我的第一段 JavaScript</h1> <p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p> <script>
function myFunction()
{
x=document.getElementById("demo"); // 找到元素
x.innerHTML="Hello JavaScript!"; // 改变内容
}
</script> <button type="button" onclick="myFunction()">点击这里</button> </body>
</html>

JavaScript:改变 HTML 图像

本例会动态地改变 HTML <image> 的来源 (src):

<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('myimage')
if (element.src.match("bulbon"))
{
element.src="/i/eg_bulboff.gif";
}
else
{
element.src="/i/eg_bulbon.gif";
}
}
</script> <img id="myimage" onclick="changeImage()" src="/i/eg_bulboff.gif"> <p>点击灯泡来点亮或熄灭这盏灯</p> </body>
</html>
<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('myimage')
if (element.src.match("bulbon"))
{
element.src="http://www.w3school.com.cn/i/eg_bulboff.gif";
}
else
{
element.src="http://www.w3school.com.cn/i/eg_bulbon.gif";
}
}
</script> <img id="myimage" onclick="changeImage()" src="http://www.w3school.com.cn/i/eg_bulboff.gif"> <p>点击灯泡来点亮或熄灭这盏灯</p> </body>
</html>

JavaScript 能够改变任意 HTML 元素的大多数属性,而不仅仅是图片。


JavaScript:改变 HTML 样式

改变 HTML 元素的样式,属于改变 HTML 属性的变种。

x=document.getElementById("demo")  //找到元素
x.style.color="#ff0000"; //改变样式

JavaScript:验证输入

JavaScript 常用于验证用户的输入。

if isNaN(x) {alert("Not Numeric")};

提示:JavaScript 与 Java 是两种完全不同的语言,无论在概念还是设计上。

Java(由 Sun 发明)是更复杂的编程语言。

ECMA-262 是 JavaScript 标准的官方名称。

JavaScript 由 Brendan Eich 发明。它于 1995 年出现在

Netscape 中(该浏览器已停止更新),并于 1997 年被 ECMA(一个标准协会)采纳。

JS 简介的更多相关文章

  1. prototype.js简介

    prototype.js简介 2007-11-21 14:22 prototype.js是一个很强大的Javascript函数库,它可以让你很轻松的使用一些特效,实现AJAX的功能.虽然prototy ...

  2. HTML基础--JS简介、基本语法、类型转换、变量、运算符、分支语句、循环语句、数组、函数、函数调用.avi

    JS简介 1.JavaScript是个什么东西? 它是个脚本语言,需要有宿主文件,它的宿主文件是HTML文件. 2.它与Java什么关系? 没有什么直接的联系,Java是Sun公司(已被Oracle收 ...

  3. 01 Node.js简介, 安装&配置

    Node.js 简介 Node.js 是什么 Node.js 有着强大而灵活的包管理器(node package manager,npm) 目前, 已经有强大第三方工具模块, 例如数据库连接, 网站开 ...

  4. Vue.js简介

    Vue.js简介 Vue.js的作者为Evan You(尤雨溪),任职于Google Creative Lab,虽然是Vue是一个个人项目,但在发展前景上个人认为绝不输于Google的AngularJ ...

  5. Gulp.js简介

    Gulp.js简介 我们讨论了很多关于怎么减少页面体积,提高重网站性能的方法.有些是操作是一劳永逸的,如开启服务器的gzip压缩,使用适当的图片格式,或删除一些不必要的字符.但有一些任务是每次工作都必 ...

  6. 《React Native 精解与实战》书籍连载「Node.js 简介与 React Native 开发环境配置」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

  7. vue学习(一)、Vue.js简介

    Vue.js 五天 汤小洋一. Vue.js简介1. Vue.js是什么Vue.js也称为Vue,读音/vju:/,类似view,错误读音v-u-e 版本:v1.0 v2.0 是一个构建用户界面的框架 ...

  8. Zepto.js简介

    Zepto.js简介 一.总结 一句话总结: Zepto.js语法和jquery起码百分之90相似,主要做移动端框架,和jquery mobile是一个类型的概念 1.Zepto.js做移动端的特点? ...

  9. 在electron中使用sqlite:sql.js简介

    在electron中使用sqlite:sql.js简介 在开发electron应用的时候如果想要使用sqlite3,步骤上除了npm安装以外还要rebuild,比较麻烦.如果你想找一个开箱即用的sql ...

随机推荐

  1. HTTP认知(请求与响应)

    web的工作是:浏览器发送请求报文 + 服务端返回响应报文 通俗的说一下web工作的一个流程: 浏览器向服务端发送HTTP请求报文:这条请求报文组成由请求行.请求头.请求体三大部分组成: 1.请求行 ...

  2. iOS核心动画高级技巧 - 7

    13. 高效绘图 高效绘图 不必要的效率考虑往往是性能问题的万恶之源. ——William Allan Wulf 在第12章『速度的曲率』我们学习如何用Instruments来诊断Core Anima ...

  3. docker 使用mysqldump命令备份导出项目中的mysql数据

    下图为镜像重命名后的镜像名为uoj,现在要把这个镜像中的mysql导出 运行如下命令: docker exec -it uoj mysqldump -uroot -proot app_uoj233 & ...

  4. gdisk转fdisk

    分区测试的时候发现之前用gdisk分区之后,就无法用fdisk进行分区了,哪怕格式化了也不行,通过fdisk 查看硬盘,发现硬盘都变成了GPT分区,无法通过fdisk进行分区操作,所以要通过parte ...

  5. 离线安装Mariadb

    CentOS7.4开发站系统和红旗Asianux-7.3离线安装Mariadb 安装 需要Root权限 # 解压离线rpm包 tar -xvf Mariadb5.5.56.tar cd Mariadb ...

  6. 在kubernetes 集群内访问k8s API服务

    所有的 kubernetes 集群中账户分为两类,Kubernetes 管理的 serviceaccount(服务账户) 和 useraccount(用户账户).基于角色的访问控制(“RBAC”)使用 ...

  7. 2019icpc上海站 打星体验,首次感想 D K代码

    暑期训练以来首次参赛,体验还行吧,过程有些战战兢兢. 刚开始以为是正式队,热身赛只过了一题,有很大的压力,正赛前一天晚上才知道是打星队,有点如释重负的感觉.也幸好都是打星队,不然真的有可能打铁,虽然实 ...

  8. 牛客国庆训练 H.千万别用树套树

    链接https://ac.nowcoder.com/acm/contest/1108/H 国庆队内训练的题,当时还完全没思路,就没补.现在会树状数组了,倒是能想一想,不过网上题解好多用线段树传数组的? ...

  9. 磁盘修复 mount: wrong fs type running e2fsck

    当服务器或PC机器的硬盘在使用一段时间后,会出现无法使用正常进行使用: 1. 当将文件系统挂载到指定的目录的时候,会出现mount 失败,如下图: [root@template ~]# mount / ...

  10. Java 9 ← 2017,2019 → Java 13,来看看Java两年来的变化

    距离 2019 年结束,只剩下 33 天了.你做好准备迎接 2020 年了吗? 一到年底,人就特别容易陷入回忆和比较之中,比如说这几天的对比挑战就火了! 这个话题登上了微博的热搜榜,也刷爆了朋友圈, ...