【VScode配置HTML如何编译 基础 JavaScript 实例】

基础 JavaScript 实例

VScode

打开扩展搜索

右键看到即可

用JavaScript输出文本

javascript 复制代码
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>
	
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<script>
document.write(Date());
</script>
	
</body>
</html>

用JavaScript改变HTML元素

javascript 复制代码
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>
	
<h1>我的第一个 Web 页面</h1>
<p id="demo">我的第一个段落。</p>
<script>
document.getElementById("demo").innerHTML="段落已修改。";
</script>
	
</body>
</html>

一个外部JavaScript

javascript 复制代码
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>
	
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
<p><b>注释:</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p>
<script src="myScript.js"></script>
	
</body>
</html>


相关推荐
betazhou3 分钟前
借用Deepseek写一个定期清理备份文件的ps脚本
开发语言·前端·javascript·ps·deepseek·清理备份文件
英俊潇洒美少年6 分钟前
vue confirm、messageBox等弹窗关闭后焦点残留问题
前端·javascript·vue.js
harrain12 分钟前
vue3怎么扩展第三方依赖库内部逻辑(拿element plus举例)
前端·javascript·vue.js·elementui
资深web全栈开发22 分钟前
JS防爬虫3板斧
开发语言·javascript·爬虫
天若有情67334 分钟前
从语法拆分到用户感知:我的前端认知重构之路
前端·javascript
_OP_CHEN37 分钟前
【前端开发之CSS】(五)CSS 盒模型深度解析:从基础到实战,掌控页面布局核心
前端·css·html·盒模型·页面开发·页面布局·页面美化
0思必得037 分钟前
[Web自动化] 爬虫基础
运维·爬虫·python·selenium·自动化·html
摘星编程40 分钟前
用React Native开发OpenHarmony应用:DrawerNavigation侧滑关闭
javascript·react native·react.js
阿蒙Amon41 分钟前
TypeScript学习-第2章:基础类型
javascript·学习·typescript
Getgit43 分钟前
在 VS Code 中配置 PHP 开发环境完整指南
开发语言·vscode·php·intellij-idea·database