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


相关推荐
css趣多多1 小时前
Vue 响应式无限递归问题总结
前端·javascript·vue.js
强子感冒了2 小时前
JavaScript 零基础入门笔记:核心概念与语法详解
开发语言·javascript·笔记
FindYou.3 小时前
基于mdEditor实现数据的存储和回显(导出pdf&表情包&目录)
javascript·vue
星火开发设计3 小时前
标准模板库 STL:C++ 的利器 —— 容器、算法、迭代器
java·开发语言·数据结构·c++·算法·html
SuperEugene4 小时前
数组查找与判断:find / some / every / includes 的正确用法
前端·javascript
phltxy5 小时前
Vue进阶实战:自定义指令与插槽的核心用法及实战案例
前端·javascript·vue.js
Never_Satisfied5 小时前
在JavaScript / HTML中,触发某个对象的click事件
开发语言·javascript·html
许同5 小时前
JS-WPS 自动化办公(5)多Sheet整合
开发语言·前端·javascript
_OP_CHEN6 小时前
【前端开发之JavaScript】(四)JS基础语法下篇:函数与对象核心要点深度解析
开发语言·前端·javascript·界面开发·前端开发·网页开发·语法基础
henry1010106 小时前
通过GitHub Page服务免费部署静态Web网站
前端·html·github·html5