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


相关推荐
andr_gale1 小时前
02_uniapp自定义上凸效果的底部TabBar
前端·javascript·uni-app·移动端
倾听醉梦语1 小时前
React/Vite/Next.js 前端开发工具 SpotPatch:点击页面元素精准定位 JSX/TSX 源码
javascript·react·ai编程·vite·next.js·前端开发工具
2401_881828322 小时前
简易文本处理网页工具|AI 通识课第三次作业
前端·javascript·html
障碍的枫子2 小时前
Vue组件导出&渲染
前端·javascript·vue.js
海带紫菜菠萝汤3 小时前
MSE (Media Source Extensions) 实战:流媒体分块加载与自适应码率
前端·javascript·音视频
张元清4 小时前
React useMount Hook:只在挂载时执行一次的正确姿势 (2026)
javascript·react.js
breeze jiang4 小时前
JavaScript 单例模式:用静态属性保证 Popup 只创建一次
开发语言·javascript·单例模式
No Silver Bullet4 小时前
Vue进阶(贰幺叁)vue.config.js 中 productionSourceMap 作用详解
前端·javascript·vue.js
用户847181054194 小时前
LangChain中间件教程及DeepAgents应用
javascript·agent
huabuyu4 小时前
INP 自动化归因与自愈:如何自动定位、修复并验证一次卡顿
前端·javascript