JavaScript-body 中的 JavaScript 函数\head 中的 JavaScript 函数

最新推荐文章于 2023-06-27 10:06:21 发布
最新推荐文章于 2023-06-27 10:06:21 发布
阅读量1.5k 收藏
点赞数
分类专栏： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012701023/article/details/46234649
版权


HTML 中的脚本必须位于 <script> 与 </script> 标签之间。

脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。



JavaScript 函数和事件

上面例子中的 JavaScript 语句，会在页面加载时执行。

通常，我们需要在某个事件发生时执行代码，比如当用户点击按钮时。

如果我们把 JavaScript 代码放入函数中，就可以在事件发生时调用该函数。

您将在稍后的章节学到更多有关 JavaScript 函数和事件的知识。




<head> 或 <body> 中的 JavaScript

可以在 HTML 文档中放入不限数量的脚本。

脚本可位于 HTML 的 <body> 或 <head> 部分中，或者同时存在于两个部分中。

通常的做法是把函数放入 <head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。



body 中的 JavaScript 函数

<!--注意
innerHTML="My First JavaScript Function 不能写成innerHTML("My First JavaScript Function");
<button type="button" οnclick="myFunction()">Try it</button> 这行代码不能放在<script>标签中
否则不生效-
-->

<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html charset=utf-8"/>
<head>

</head>
<body>
<center>
    <h1>This is a Java Script Page</h1>
    <p id="demo">Hello Java Script</p>
    <script>
    function myFunction()
    {
        document.getElementById("demo").innerHTML="My First JavaScript Function";
    }

    </script>
    <button type="button" οnclick="myFunction()">Try it</button>
</center>

</body>

</html>

-----------------------------------------------------------------------------------------------------------------------

-----------------------------------------------------------------------------------------------------------------------


<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<head>
    <title></title>
</head>
<center>
<body>

<script>
    document.write("<h1>This is my first Java Script</h1>");
    document.write("<p>Come with me!</p>");
</script>

</body>
</center>
</html>

-----------------------------------------------------------------------------------------------------------------------

-----------------------------------------------------------------------------------------------------------------------

head 中的 JavaScript 函数

<!--
<head> 中的 JavaScript 函数

在本例中，我们把一个 JavaScript 函数放置到 HTML 页面的 <head> 部分。

该函数会在点击按钮时被调用：
-->
<!--<button type="button" οnclick="myFunction()">Try it</button>
在函数调用的过程中将函数的名称写错
-->
<!DOCTYPE html>
<html>
<center>
<meta http-equiv="Content-Type" content="text/html charset=utf-8"/>
<head>
    <script>
    function myFunction()
    {
        document.getElementById("demo").innerHTML="My First JavaScript Function";
    }
    </script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph</p>

<button type="button" οnclick="myFunction()">Try it</button>
</body>
</center>
</html>




-FIGHTING-
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
java调用javascript函数_[Java教程]JavaScript函数的4种调用方法详解
weixin_29009971的博客
02-26 789
[Java教程]JavaScript函数的4种调用方法详解0 2016-08-09 00:00:12在JavaScript中，函数是一等公民，函数在JavaScript中是一个数据类型，而非像C#或其他描述性语言那样仅仅作为一个模块来使用。函数有四种调用模式，分别是：函数调用形式、方法调用形式、构造器形式、以及apply形式。这里所有的调用模式中，最主要的区别在于关键字 this 的...
javascript中普通函数的使用介绍
10-26
在JavaScript中，函数是一种可重复使用的代码块，可以执行特定任务。普通函数是JavaScript中最基本的函数类型，本文将深入探讨其使用方法和特点。 首先，我们看一个简单的示例： ```html <head> <title>...
<head> 中的 JavaScript 函数
adiking520110的博客
01-16 135
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <meta charset="utf-8" /> <script...
关于js代码放在head或者body的认识
qq_43642464的博客
08-29 468
关于js代码放在head或者body的认识。 css和html是同步渲染的，js是从上至下执行的，假设我们把js放在头部，js里面需要获取某一个便签，但是这时候html还没有渲染完毕，这就会导致出现标签无法获取的情况，这时候我们需要进行相应的预处理，但是对于一般的初学者，建议是放在body底部，这样一来，html渲染完毕之后才会执行js里面的代码，不会出现这样的问题。如果我们基于需要放在头部的话，需要在js代码内部加入口函数，如下。 window.οnlοad=funtction(){ js code }
ScriptEngineManager的使用说明
iechenyb专栏
12-30 8522
import java.util.ArrayList; import java.util.List; import java.util.Map; import java.util.TreeMap; import javax.script.Invocable; import javax.script.ScriptEngine; import javax.script.ScriptEngineMa...
某个html页面中，head中的一个js可以调用另一个js的函数吗？
Ideality_hunter的专栏
12-09 3216
答案是肯定的。
关于javascript 回调函数中变量作用域的讨论
10-29
### JavaScript回调函数中变量作用域解析 #### 一、引言 JavaScript作为一种广泛使用的脚本语言，其灵活性和强大功能使其成为Web开发不可或缺的一部分。在JavaScript编程中，回调函数是一种非常重要的概念，尤其是...
javascript中函数的写法实例代码详解
12-12
具体代码如下所述： <!DOCTYPE html> <... <head>...meta name="viewport" content="width=device-width, initial-scale=1.0">.../head>...body>... //js函数的书写 function myFunction() {
JavaScript实现同时调用多个函数的方法
10-23
在HTML中，我们通常会使用事件处理程序，如`onClick`，来触发JavaScript函数的执行。以下代码展示了一个HTML按钮，当用户点击这个按钮时，会同时调用两个函数`fun1`和`fun2`： ```html <head> 同时调用多个函数 ...
JavaScript中反正弦函数Math.asin()的使用简介
12-12
此方法返回弧度数字的反正弦。ASIN方法返回-1到1 ，x-pi/2和PI/2弧度之间...JavaScript Math asin() Method</title> </head> <body> [removed] var value = Math.asin(-1); [removed]("First Test Va
JavaScript中函数调用
xuekatie的博客
03-17 64
函数调用 <style> #box { width: 100px; height: 100px; background: red; } </style> <body> <button id="btn1">按钮1</button> <button id="btn2">按钮2</button> <div id="box"></div&g.
JAVA调用JavaScript方法
最新发布
qq_42796149的博客
06-27 6344
JAVA调用JavaScript方法
<body> 中的 JavaScript 函数
技术何
07-19 1948
中的 JavaScript 函数在本例中，我们把一个 JavaScript 函数放置到 HTML 页面的 部分。该函数会在点击按钮时被调用：实例My Web PageA ParagraphTry itfunction myFunction(){document.getElementById("demo").innerHTML="My First JavaScript Function";}
body中javascript代码及onload函数执行顺序
SmileCherishXiaor的专栏
08-11 298
转自 [url]http://apps.hi.baidu.com/share/detail/39228109[/url]
有的js为什么放在body里面
滕青山博客
02-26 1486
理论上来说js标签放在html文档的任何位置都可以，规范起见，推荐放到body结束标签的末尾，包含到body标签内： <body> <!-- 这里是其他的HTML标签 --> <script> // 这里是代码 </script> </body> 这样处理的好处是无需担心因页面未完成加载，造成DOM节点获取不到，使脚本报错的问题，而且能避免因脚本运行缓慢造成页面卡死的问题。另外，Yahoo的前端优化指南里就有这一条。 放
Javascript位置 body之前、后 执行顺序
alian_1126的专栏
01-22 2493
简介：<br />当页面加载的时候，嵌入html标记的js代码和位于<body></body>之间的js代码将被执行；当调用的时候，位于<head></head>之间代码和外部js文件代码将被执行 <br /> <br />1.根据实际需要放置代码？<br />有时候，您实际上需要把代码放置在不同地方以符合代码运行要求。比如，您需要在代码全部载入浏览器后再运行代码，那就可以<br />将<script>标签放在</html>后面去，如果您需要在页面载入的时候运行代码，可以把js代码放入<head></h
关于JavaScript代码放在body中还是head的问题
weixin_30481087的博客
07-20 405
　　从事前端也有段时间了，期间也看过不少别人写的代码，但是发现一个问题（不能说是一个问题吧）就是有些人把js代码放在head中，也有些人把js代码放在body中，回头想一想，哎，还真想不出为啥。在网上查了查其实这是个很初级的问题（还亏我工作了一段时间，惭愧！）好了，废话不多说，看问题。 　　其实浏览器在解析HTML是从上往下的。所以把js脚本放在head中的话，浏览器会先执行js脚本，...
javascript中print函数
03-27
JavaScript中的print()函数用于在浏览器中打印指定的文本、HTML文档或当前窗口的内容。 语法： window.print(); 示例： <!DOCTYPE html> <head> <title>Print Example </head> <body> <h1>Hello World! <p>...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值