JavaScript和HTML结合的详细说明

HTML中的JavaScript脚本必须位于Script和/script标签之间，JavaScript脚本可以放在HTML页面的body标签和head标签中，通常根据情况放在head标签中。1.脚本标签如果需要在HTML页面中插入JavaScript脚本，请使用脚本标签。Script和/script告诉JavaScript从哪里开始和结束。脚本和/script之间的代码行包含JavaScript:

span style=' font-size :18 px；'脚本类型=' text/JavaScript' alert('欢迎来到JavaScript世界！');/script/span您不需要理解上面的代码。只要明白浏览器会在Script和/script之间解释和执行JavaScript。那些旧实例可能在脚本标签中使用type='text/javascript '。现在已经没有必要这样做了。JavaScript是所有现代浏览器和HTML5中的默认脚本语言。鉴于刚刚学习的JavaScript语言可以使用！二、正文中的JavaScript在这个例子中，当页面被加载时，JavaScript会将文本写到HTML的正文中：示例代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML L1-Transitional . DTD ' html xmlns=' http://www . w3 . org/1999/XHTML ' head meta http-equiv=' Content-Type ' Content=' text/html；charset=GB 2312 '/title JavaScript脚本语言/title /head body p JavaScript可以直接写入HTML输出流：/p script type=' text/JavaScript ' document . write(' h1这是一个标题/h1 ')；document . write(' p这是一个段落。/p ')；/script p您只能在HTML输出流中使用strongdocument.write/strong。如果您在文档加载后使用它(例如，在函数中)，整个文档将被覆盖。/p/body/html让我们先看看运行结果，不管JavaScript代码是如何编写和运行的：

3.JavaScript函数和事件上例中的JavaScript语句将在页面加载时执行。通常，我们需要在事件发生时执行代码，例如当用户单击按钮时。如果我们将JavaScript代码放入一个函数中，我们可以在事件发生时调用该函数。

你可以在一个HTML文档中放入无限多的脚本。脚本可以位于HTML的主体或头部，也可以位于这两个部分。通常的做法是将函数放在标题部分或页面底部。这样，它们可以放在同一个地方，而不会干扰页面的内容。

在这个例子中，我们在网页的头部放了一个JavaScript函数。单击按钮时会调用该函数：示例代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML L1-Transitional . DTD ' html xmlns=' http://www . w3 . org/1999/XHTML ' head meta http-equiv=' Content-Type ' Content=' text/html；charset=GB 2312 '/title JAVAScript脚本语言/title script type=' text/JAVAScript ' function my function(){ document . getelementbyid(' demo ')。innerhtml=' myfirst JavaScript函数'；}/script/head body h1 my web page/h1 p id=' demo ' a段落。/p button type=' button ' onclick=' my function()'单击此处/button /body /html运行的结果是：

点击按钮后的效果是：

在这个例子中，我们在HTML页面的主体部分放了一个JavaScrip函数。单击按钮时会调用该函数：示例代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。L1-过渡时期。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' head meta http-equiv=' Content-Type ' Content=' text/html；charset=GB 2312 '/TItle JAVAScript脚本语言/标题/头体h1我的第一个网页/h1 p id='demo'A段落/p button type=' button ' onclick=' my function()'点击这里/按钮脚本类型=' text/JavaScript '函数my function(){ document。getelementbyid(' demo ').innerHTML='我的第一个Java Script语言函数；}/脚本/正文/html运行的结果与上述五的结果一样！提示：我们把Java脚本语言放到了页面代码的底部，这样就可以确保在p元素创建之后再执行脚本。七、外部的Java脚本语言我们也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。外部Java脚本语言文件的文件扩展名是js。如需使用外部文件，请在脚本标签的' src '属性中设置该。射流研究…文件，如果有大量的Java脚本语言代码，我们提倡使用外部的Java脚本语言方式，一般我们也采用分离的方式连接到超文本标记语言文档中。实例超文本标记语言代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。L1-过渡时期。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' head meta http-equiv=' Content-Type ' Content=' text/html；charset=GB 2312 '/TItle JAVAScript脚本语言/title脚本类型=' text/JavaScript ' src=' http :/js/Myscript。js /脚本/头体h1我的网页/h1 p id='演示' a段落./p button type=' button ' onclick=' my function()'点击这里/按钮p注释：我的功能保存在名为myScript.js '的外部文件中/p /body /html myScript.js代码：

function my function(){ document。getelementbyid(' demo ').innerHTML='我的第一个Java Script语言函数；} 运行的结果和上述一致！提示：在头或身体中引用脚本文件都是可以的。实际运行效果与您在脚本标签中编写脚本完全一致。外部脚本不能包含脚本标签。

以上就是Java脚本语言与超文本标记语言的结合方法，希望对大家的学习有所帮助。