JavaScript学习

最新推荐文章于 2023-06-06 15:21:13 发布

格兰芬多见习魔法师

最新推荐文章于 2023-06-06 15:21:13 发布

阅读量121

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_41371716/article/details/97815423

本文介绍JavaScript如何操作HTML元素，包括修改文本、样式和响应用户事件。通过实例展示了document.write、getElementById和innerHTML的使用，以及如何为按钮添加点击事件。

JavaScript

HTML输出
document.write("<p>这是一个段落。</p>");
事件响应
<button type="button" onclick="myFunction()">点我！</button>
处理HTML样式
document.getElementById("demo").style.color="#ff0000";

</head>
<body>
	
<h1>我的第一段 JavaScript</h1>
<p id="demo">
JavaScript 能改变 HTML 元素的样式。
</p>
<script>
function myFunction()
{
	x=document.getElementById("demo") // 找到元素
	x.style.color="#ff0000";          // 改变样式
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
	
</body>

<body>

<h1>我的第一个 JavaScript </h1>

<p id="demo">
JavaScript 可以触发事件，就像按钮点击。</p>

<script>
function myFunction()
{
	document.getElementById("demo").innerHTML="Hello JavaScript!";
}
</script>

<button type="button" onclick="myFunction()">点我</button>

</body>

script标签

属性	值	描述
async	async	规定异步执行脚本（仅适用于外部脚本）。
charset	charset	规定在脚本中使用的字符编码（仅适用于外部脚本）。
defer	defer	规定当页面已完成解析后，执行脚本（仅适用于外部脚本）。
src	URL	规定外部脚本的 URL。
type	MIME-type	规定脚本的 MIME 类型。
xml:space	preserve	HTML5 不支持。规定是否保留代码中的空白。