Javascript代码在网页中出现的位置
下面有具体的代码和截图
Javascript代码在网页中出现的位置：
1.直接写在事件名称的后面
2.做成函数，写在head标签中，比较规范的做法是写在window.onload = function() {}这句话的function函数体中
3.写在单独的js文件中
/*
网页元素又可以称为文档元素，网页就是文档
使用javascript操作网页上的元素，也就是dom编程
dom：Document Object Model，简称DOM(即文档对象模型)，说白了，就是把网
页当成一个文档来看待，把网页上的每个标签/元素/节点当成一个对象来看待
我们可以把标签叫成元素，或者叫成节点!(标签、元素、节点这3者都是一样的，只是不同的叫法而已)
元素的英文是Element
节点的英文是Node
标签的英文是Tag
*/
/*
注意：取函数名的时候，要见名知意
函数名不能取javascript中的关键字和保留字，尽量避开javascript中的关键字和保留字
保留字:reserved word
*/
<script type="text/javascript">
/*
注意：取函数名的时候，要见名知意
函数名不能取javascript中的关键字和保留字，尽量避开javascript中的关键字和保留字
保留字:reserved word
*/
/*
网页元素又可以称为文档元素，网页就是文档
使用javascript操作网页上的元素，也就是dom编程
dom：Document Object Model，简称DOM(即文档对象模型)，说白了，就是把网
页当成一个文档来看待，把网页上的每个标签/元素/节点当成一个对象来看待
我们可以把标签叫成元素，或者叫成节点!(标签、元素、节点这3者都是一样的，只是不同的叫法而已)
元素的英文是Element
节点的英文是Node
标签的英文是Tag
*/
//定义2个函数，这是函数1
function hello(){
alert('我老家在江西省赣州市于都县');
}
//定义2个函数，这是函数2
function hello2(){
alert('中国赣州市于都县');
}
window.onload = function() {
//javascript代码写在window.onload的函数体中是最规范的写法
console.log("javascript代码写在这个函数体中是最规范的写法");
}
</script>
<br/>
<input type="button" value="问候语1" οnclick="hello()">
<br/>
onclick事件中调用函数，onclick事件后面，如果只有一行代码的话，可以不加;分号
<br/>
<input type="button" value="问候语2" οnclick="hello();">
<br/>
onclick事件中调用函数，onclick事件后面，如果只有一行代码的话，你也可以加上;分号
<br/>
<input type="button" value="问候语3" οnclick="hello();hello2()">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，最后一行代码可以不加;分号
<br/>
<input type="button" value="问候语4" οnclick="hello();hello2();">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，但最后一行代码可以不加;分号也可以加上;分号
<br/>
如下语句，在点击按钮时，会报错，hello()后面缺少;分号
<br/>
<input type="button" value="问候语5" οnclick="hello()hello2()">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，但最后一行代码可以不加;分号也可以加上;分号
<br/>
如下语句，在点击按钮时，会报错，hello()后面缺少;分号
<br/>
<input type="button" value="问候语6" οnclick="hello()hello2();">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，但最后一行代码可以不加;分号也可以加上;分号
<br/>
<br/>
下面是javascript.html页面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javascript简介概述和一个简单案例</title>
<!-- 引入js文件 -->
<script type="text/javascript" src="testjs.js"></script>
<script type="text/javascript">
/*
注意：取函数名的时候，要见名知意
函数名不能取javascript中的关键字和保留字，尽量避开javascript中的关键字和保留字
保留字:reserved word
*/
/*
网页元素又可以称为文档元素，网页就是文档
使用javascript操作网页上的元素，也就是dom编程
dom：Document Object Model，简称DOM(即文档对象模型)，说白了，就是把网
页当成一个文档来看待，把网页上的每个标签/元素/节点当成一个对象来看待
我们可以把标签叫成元素，或者叫成节点!(标签、元素、节点这3者都是一样的，只是不同的叫法而已)
元素的英文是Element
节点的英文是Node
标签的英文是Tag
*/
//定义2个函数，这是函数1
function hello(){
alert('我老家在江西省赣州市于都县');
}
//定义2个函数，这是函数2
function hello2(){
alert('中国赣州市于都县');
}
window.onload = function() {
//javascript代码写在window.onload的函数体中是最规范的写法
console.log("javascript代码写在这个函数体中是最规范的写法");
}
</script>
</head>
<body>
<h1>javascript简介概述和一个简单案例</h1>
<form name="form1">
<input type="text" name="userName" id="myUserName">
</form>
<br/>
<input type="text" name="userName2">
<br/><br/>
<input type="text" id="uName">
<br/>
alert这个单词是警告的意思，alert()是javaScript(即js)中的一个函数，弹出警告框，我们可
以用alert()函数来做一些简单的调试
<input type="button" value="打招呼1" onclick="alert('江西省赣州市于都县渡江大道XXX号');">
<input type="button" value="打招呼2" onclick="sayHello()">
<input type="button" value="打招呼3" onclick="sayHello2()">
<input type="button" value="打招呼4" onclick="sayHello3()">
<br/>
<input type="button" value="问候语1" onclick="hello()">
<br/>
onclick事件中调用函数，onclick事件后面，如果只有一行代码的话，可以不加;分号
<br/>
<input type="button" value="问候语2" onclick="hello();">
<br/>
onclick事件中调用函数，onclick事件后面，如果只有一行代码的话，你也可以加上;分号
<br/>
<input type="button" value="问候语3" onclick="hello();hello2()">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，最后一行代码可以不加;分号
<br/>
<input type="button" value="问候语4" onclick="hello();hello2();">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，但最后一行代码可以不加;分号也可以加上;分号
<br/>
如下语句，在点击按钮时，会报错，hello()后面缺少;分号
<br/>
<input type="button" value="问候语5" onclick="hello()hello2()">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，但最后一行代码可以不加;分号也可以加上;分号
<br/>
如下语句，在点击按钮时，会报错，hello()后面缺少;分号
<br/>
<input type="button" value="问候语6" onclick="hello()hello2();">
<br/>
onclick事件中调用函数，onclick事件后面，如果不止有一行代码的话，你必须在每行代码后面加上;分号，但最后一行代码可以不加;分号也可以加上;分号
<br/>
<br/>
<pre>
顺便复习一下html中的一些知识点：
html中有3种按钮
1.type="submit"
2.type="reset"
submit提交按钮和reset重置按钮需要写在表单中才有意义
<br/>
3.type="button"
button是普通按钮，可以写在表单中，也可以写在非表单中
<br/>
普通按钮就是系统没有预先定义功能的按钮，而submit提交按钮就是系统预先定义了提交功能的按钮，所以submit提
交按钮只能用来做表单提交功能，而reset重置按钮也是系统预先定义了重置功能的按钮，所以reset重置按
钮只能用来做重置表单功能，因为普通按钮在系统中没有预先定义功能，所以普通按钮可以用来做其他各种各样的事情，可
以根据自己的需要来定义功能，也可以定义成提交功能，也可以定义成重置功能，也可以定义成其他功能
<br/>
事件：发生了一件事情，以及发生了事情后的处理办法，事件的单词是event，该单词在计
算机中出现的频率比较高，稍微记一下该单词
比如：onclick点击事件，click是点击的意思，on是当...时候
Javascript代码在网页中出现的位置：
1.直接写在事件名称的后面
2.做成函数，写在head标签中，比较规范的做法是写在window.onload = function() {}这句话的function函数体中
3.写在单独的js文件中
</pre>
</body>
</html>下面是testjs.js
/**
*
*/
//在有表单的情况下，我们可以通过如下办法来找到表单中的元素
//这种方式是通过表单的名字和元素的名字来找到元素
function sayHello(){
//通过forms[下标].表单中的元素名的方式找到表单中的元素
alert("您好，" + document.forms[0].userName.value);
//直接通过表单名.表单中的元素名的方式找到表单中的元素
alert("大家好，我是" + form1.userName.value);
//通过getElementById()函数查找元素
alert("哈喽，" + document.getElementById("myUserName").value);
}
//在没有表单的情况下，我们可以通过如下办法来找到我们想要的元素
/*
通过getElementsByName()函数查找元素，这种方式是通过元素名字来查找的，但是网
页中可能有多个元素同名的情况,该函数返回的是数组
*/
function sayHello2(){
alert("hello，" + document.getElementsByName("userName2")[0].value);
}
/*
通过getElementById()函数查找元素，这种方式是通过元素id来查找的，该函
数返回的是单个元素，如果网页中有多个元素的id相同，该函数只返回最先找到的那个元素
*/
function sayHello3(){
alert("hi，" + document.getElementById("uName").value);
}下面是截图
扫一扫
245
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
