js学习三：操作属性的方法

那丶

于 2015-08-06 21:25:29 发布

阅读量393

点赞数

分类专栏： JS漫长学习路

本文链接：https://blog.youkuaiyun.com/zy1030070058/article/details/47323391

版权

JS漫长学习路专栏收录该内容

4 篇文章

订阅专栏

本文介绍如何使用JavaScript通过三种不同方式来更改HTML元素的属性值，包括直接修改、使用方括号表示法及setAttribute方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

假如有以下代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>第一个js效果</title>
</head>
<style type="text/css">
#div2{width: 80px;height: 200px;background: green;display: none;}
</style>
<body>
<div id="div1">
	为了你的按钮
</div>
<input id="btn1" type="button" value="点我"/>
<div id="div2">
	这是第二个div
</div>
<input id="txt1" type="text" value="e"/>
<input id="btn2" type="button" value="安妮">
<div id="div3">
<span>图片<input id="txt2" type="text" value=""/></span>
</div>
<script src="index.js"></script>
</body>
</html>

我们在写js的时候，比如要改变id为txt1的value，那我们怎么操作属性？

有三种方法：

①

var oText=document.getElementById("txt1");
	oText.value="123"

②

var oText=document.getElementById("txt1");
	oText["value"]="123"

③

var oText=document.getElementById("txt1");
	oText.setAttribute("value","123");