1.脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备
2.写入HTML输出
<html>
<body>
<script type="text/javascript">
document.wite("<h1>JS简介</h1>");
document.wite("<p>javascript是世界上最流行的编程语言</p>");
</script>
</body>
</html>
运行效果
只能在 HTML 输出中使用 document.write。如果在文档加载后使用该方法，会覆盖整个文档。
3.对事件作出反应
<button type="button" onclick="alert('OK')">请点击</button>
运行效果
alert()（警告） 函数在 JavaScript 中并不常用，但它对于代码测试非常方便。onclick（单击） 事件只是即将在本教程中学到的众多事件之一
4.改变HTML内容/图像/样式
内容
<p id="p">js可以改变html的内容</p>
<script type="text/javascript">
function myf() {
x=document.getElementById("p");
x.innerHTML="Hello javascript";
}
</script>
<button type="button" onclick="myf()">请点击</button>
运行效果：
未点击效果图
点击后效果图
document.getElementByID("some id")方法是 HTML DOM 中定义的。DOM（文档对象模型）是用以访问 HTML 元素的正式 W3C 标准。
图像
<img id="img" onclick="image()" src="../img/dpn.gif">
<script type="text/javascript">
function image() {
element=document.getElementById('img')
if (element.src.match("dpn")) {
element.src="../img/dpff.gif";
}
else {
element.src="../img/dpn.gif";
}
}
</script>
运行效果
初始效果图
单次点击效果图
多次点击可以使灯来回点亮和熄灭。
JavaScript 能够改变任意 HTML 元素的大多数属性，而不仅仅是图片。
样式
<p id="p">js能改变html元素的样式</p>
<script type="text/javascript">
function myf() {
x=document.getElementById("p");
x.style.color="#F0F";
}
</script>
<button type="button" onclick="myf()"></button>
运行效果
初始效果图
点击事件效果图
改变 HTML 元素的样式，属于改变 HTML 属性的变种。
5.验证输入
JavaScript 常用于验证用户的输入。
<p>请输入数字</p>
<input type="text" id="sz">
<script type="text/javascript">
function myf() {
var x=document.getElementById("sz").value;
if(x==""||isNaN(x)) {
alert("Not Numeric");
}
}
</script>
<button type="button" onclick="myf()">请点击</button>
运行效果
输入数字时运行效果图
未输入任何值效果图
输入非数字是效果图
网友评论