JavaScript入门

csuzhucong

已于 2023-01-05 00:34:27 修改

阅读量1.3k

点赞数

文章标签： javascript

于 2021-10-05 21:30:00 首次发布

本文链接：https://blog.csdn.net/nameofcsdn/article/details/120615295

版权

这篇博客介绍了JavaScript的基础知识，包括代码块、函数、外部文件引用、内联代码的使用方式，以及JS的语法特点。通过示例展示了如何在HTML中嵌入JS代码，并提供了OJ实战链接，帮助读者从零开始学习JavaScript。

摘要由CSDN通过智能技术生成

入门JavaScript 简称 JS，是一门很灵活的脚本语言。

在线运行：https://www.w3school.com.cn/tiy/t.asp?f=eg_js_variables_undefined

一，代码块——script标签

JS代码块放在script标签中，标签可以放在网页中任何位置（无论head还是body中）

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = "我的第一段 JavaScript";
</script>

当网页加载的时候，代码块会被执行。

二，函数

script标签中可以放函数，事件可以调用函数，如按钮点击事件：

<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "段落已被更改。";
}
</script>

<p id="demo">一个段落。</p>

<button type="button" onclick="myFunction()">试一试</button>

三，js文件

html和js文件分开，js中存放函数，相当于函数库，html可以直接调用函数：

外部文件：myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "段落被更改。";
}

同一目录下的html：

<p id="demo">一个段落。</p>

<button type="button" onclick="myFunction()">试一试</button>

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

如果html不在同一目录，那src就需要对应的写法，规则和C语言或python中读文件的写法是一样的。

如果有多个js，那就写多个script标签，每个里面指明一个js文件。

四，内联代码

如果函数很简单，也可以内联到html的标签中

<p id="demo">JavaScript 能够改变 HTML 内容。</p>

<button type="button" 
onclick='document.getElementById("demo").innerHTML = "Hello JavaScript!"'>
点击我！
</button>