【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>


相关推荐
Hamm4 小时前
不想花一分钱玩 OpenClaw?来,一起折腾这个!
javascript·人工智能·agent
Setsuna_F_Seiei5 小时前
AI 对话应用之 JS 的流式接口数据处理
前端·javascript·ai编程
英俊潇洒美少年5 小时前
react如何实现 vue的$nextTick的效果
javascript·vue.js·react.js
理性的曜5 小时前
VoloData——基于LangChain的智能数据分析系统
人工智能·vscode·数据分析·npm·reactjs·fastapi·ai应用
肖恭伟7 小时前
VScode入门学习
ide·vscode·学习
隔壁小邓8 小时前
前端Vue项目打包部署实战教程
前端·javascript·vue.js
TON_G-T9 小时前
javascript中 Iframe 处理多端通信、鉴权
开发语言·前端·javascript
周淳APP9 小时前
【JS之闭包防抖节流,this指向,原型&原型链,数据类型,深浅拷贝】简单梳理啦!
开发语言·前端·javascript·ecmascript
kyriewen9 小时前
console.log 骗了我一整个通宵:原来它才是时间旅行者
前端·javascript·chrome
冴羽9 小时前
在浏览器控制台调试的 6 个秘密技巧
前端·javascript·chrome