JavaScript入门——简单代码实例

里克贝斯

发布于 2021-05-21 15:34:23

5040

发布于 2021-05-21 15:34:23

文章被收录于专栏：图灵技术域图灵技术域

JavaScript，也称ECMAScript，是一种基于对象和事件驱动并具有相对安全性并广泛用于客户端网页开发的脚本语言，同时也是一种广泛用于客户端Web开发的脚本语言。

JavaScript是世界上最流行的脚本语言，因为你在电脑、手机（Android、iOS）、平板上浏览的所有的网页，以及无数基于HTML5的手机App，交互逻辑都是由JavaScript驱动的。

简单地说，JavaScript是一种运行在浏览器中的解释型的编程语言。

更多简介参考：

JavaScript入门

下面给出单独的JS代码及嵌入到HTML中的JS代码用做简单实例测试，可以进入HTML测试页面测试代码。

HTML/JS代码运行器

①生成简单文本及HTML标签、循环

以99乘法表为例

JavaScript

document.write("<table border='1' bordercolor= 'red'>");
for(var i = 1; i <= 9; i++){
  document.write('<tr>');
  for(var j = 1; j <= i; j++){
    document.write('<td>');
    document.write(j+'*'+i+'='+i*j+'</td>');
  }
  document.write('</tr>');
}
document.write('</table>');

效果：

②显示警告框

XHTML

<html>
<head>
<script type="text/javascript">
function disp_alert()
{
alert("我是警告框！！")
}
</script>
</head>
<body>

<input type="button" onclick="disp_alert()" value="显示警告框" />

</body>
</html>

③检查浏览器版本

JavaScript

<script type="text/javascript">
var browser=navigator.appName
var b_version=navigator.appVersion
var version=parseFloat(b_version)
document.write("浏览器名称："+ browser)
document.write("<br />")
document.write("浏览器版本："+ version)

④自动时钟

使用日期类Date

使用setTimeout来计时

XHTML

<html>
<head>
<script type="text/javascript">
function startTime()
{
var today=new Date()
var h=today.getHours()
var m=today.getMinutes()
var s=today.getSeconds()
// add a zero in front of numbers<10
m=checkTime(m)
s=checkTime(s)
document.getElementById('txt').innerHTML=h+":"+m+":"+s
t=setTimeout('startTime()',500)
}

function checkTime(i)
{
if (i<10) 
  {i="0" + i}
  return i
}
</script>
</head>

<body onload="startTime()">
<div id="txt"></div>
</body>
</html>

②、③、④来源于：http://www.w3school.com.cn/example/jseg_examples.asp

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2018-07-12，如有侵权请联系 cloudcommunity@tencent.com 删除

javascript