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


相关推荐
故事和你918 分钟前
洛谷-【数据结构2-2】线段树1
开发语言·javascript·数据结构·算法·动态规划·图论
ZC跨境爬虫8 分钟前
跟着 MDN 学 HTML day_43:(DocumentFragment 接口详解)
前端·javascript·vue.js·ui·html·音视频
2301_8156453835 分钟前
JavaScript 核心
javascript
之歆37 分钟前
DAY_23 JavaScript 函数进阶:作用域 · 提升 · 匿名函数 · IIFE · 回调 · 递归 · Object 对象建模(下)
开发语言·javascript·ecmascript
MuYiLuck38 分钟前
02-VSCode插件与Trae原生AI编辑器实战教程
vscode·编辑器·trae·trae solo
哆哆啦0040 分钟前
CSS 选择器优先级计算规则
前端·javascript·css3
千寻girling42 分钟前
周日那天参加的力扣周赛... —— 10号
java·javascript·c++·python·算法·leetcode·职场和发展
zhoumeina991 小时前
设计器模版底图,一直渲染错误,是因为第一张图变形后内存中图片数据被改了,其他尺码一直错误
java·前端·javascript
www.021 小时前
通过 SSH 隧道将 GPT 调教为服务器专属 Agent(个人记录)
linux·服务器·vscode·gpt·大模型·ssh·api转发
ZC跨境爬虫1 小时前
跟着 MDN 学 HTML day_42:(DOMTokenList 接口详解)
前端·javascript·ui·html·ecmascript·音视频