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


相关推荐
Mr Xu_2 小时前
Vue 3 中计算属性的最佳实践:提升可读性、可维护性与性能
前端·javascript
子兮曰2 小时前
深入理解滑块验证码:那些你不知道的防破解机制
前端·javascript·canvas
Highcharts.js2 小时前
【Highcharts】如何用命令行渲染导出图片?
javascript·导出·开发文档·highcharts·命令行渲染·命令行功能
陈振wx:zchen20083 小时前
JavaScript
javascript·js
我是伪码农3 小时前
Vue 智慧商城项目
前端·javascript·vue.js
不认输的西瓜3 小时前
fetch-event-source源码解读
前端·javascript
jun_bai4 小时前
VSCode使用
ide·vscode·编辑器
x-cmd5 小时前
[x-cmd] jsoup 1.22.1 版本发布,引入 re2j 引擎,让 HTML 解析更安全高效
前端·安全·html·x-cmd·jsoup
天下代码客5 小时前
使用electronc框架调用dll动态链接库流程和避坑
前端·javascript·vue.js·electron·node.js
冰暮流星6 小时前
javascript之数组
java·前端·javascript