Web教程:JavaScript用法

开课吧开课吧锤锤2021-03-17 15:49

点赞
1
分享分享

    随着互联网的高速发展以及技术的不断革新,Web前端工程师需要掌握的技术也有所变更。前端的开发中,在页面的布局时,HTML将元素进行定义,CSS对展示的元素进行定位,再通过JavaScript实现相应的效果和交互。虽然表面看起来很简单,但这里面需要掌握的东西绝对不会少。在进行开发前,需要对这些概念弄清楚、弄明白,这样在开发的过程中才会得心应手。今天为大家介绍一下JavaScript用法

web

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

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

    <script>标签

    如需在HTML页面中插入JavaScript,请使用<script>标签。

    <script>和</script>会告诉JavaScript在何处开始和结束。

    <script>和</script>之间的代码行包含了JavaScript:

    <script>

    alert("我的第一个JavaScript");

    </script>

    您无需理解上面的代码。只需明白,浏览器会解释并执行位于<script>和</script>之间的JavaScript代码

    lamp那些老旧的实例可能会在<script>标签中使用type="text/javascript"。现在已经不必这样做了。JavaScript是所有现代浏览器以及HTML5中的默认脚本语言。

    <body>中的JavaScript

    在本例中,JavaScript会在页面加载时向HTML的<body>写文本:

    实例

    <!DOCTYPEhtml>

    <html>

    <body>

    .

    .

    <script>

    document.write("<h1>这是一个标题</h1>");

    document.write("<p>这是一个段落</p>");

    </script>

    .

    .

    </body>

    </html>

    尝试一下»

    JavaScript函数和事件

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

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

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

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

    在<head>或者<body>的JavaScript

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

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

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

    <head>中的JavaScript函数

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

    该函数会在点击按钮时被调用:

    实例

    <!DOCTYPEhtml>

    <html>

    <head>

    <script>

    functionmyFunction()

    {

    document.getElementById("demo").innerHTML="我的第一个JavaScript函数";

    }

    </script>

    </head>

    <body>

    <h1>我的Web页面</h1>

    <pid="demo">一个段落</p>

    <buttontype="button"onclick="myFunction()">尝试一下</button>

    </body>

    </html>

    尝试一下»

    <body>中的JavaScript函数

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

    该函数会在点击按钮时被调用:

    实例

    <!DOCTYPEhtml>

    <html>

    <body>

    <h1>我的Web页面</h1>

    <pid="demo">一个段落</p>

    <buttontype="button"onclick="myFunction()">尝试一下</button>

    <script>

    functionmyFunction()

    {

    document.getElementById("demo").innerHTML="我的第一个JavaScript函数";

    }

    </script>

    </body>

    </html>

    尝试一下»

    外部的JavaScript

    也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。

    外部JavaScript文件的文件扩展名是.js。

    如需使用外部文件,请在<script>标签的"src"属性中设置该.js文件:

    实例

    <!DOCTYPEhtml>

    <html>

    <body>

    <scriptsrc="myScript.js"></script>

    </body>

    </html>

    尝试一下»

    你可以将脚本放置于<head>或者<body>中,放在<script>标签中的脚本与外部引用的脚本运行效果完全一致。

    myScript.js文件代码如下:

    functionmyFunction()

    {

    document.getElementById("demo").innerHTML="我的第一个JavaScript函数";

    }

    以上就是JavaScript用法的详解,如果你对面试题感兴趣不妨点击图片,免费获得课程。

web

    如何才能在同等水平竞争中脱颖而出,除了过硬的技术,那么嗨哟一个方法就是面试资料,不是网上千篇一律的,这是你进大厂的关键。

有用1
分享