1、常用元素的属性操作
src、href
id、alt、title
1.1、获取属性的值
元素对象.属性名
1.2、设置属性的值
元素对象.属性名 = 值
1.3、示例
<body>
<button id="ldh">刘德华</button>
<button id="zxy">张学友</button> <br />
<img src="images/ldh.jpg" alt="" title="刘德华" />
<script>
// 修改元素属性 src
// 1. 获取元素
var ldh = document.getElementById("ldh");
var zxy = document.getElementById("zxy");
var img = document.querySelector("img");
// 2. 注册事件 处理程序
zxy.onclick = function () {
img.src = "images/zxy.jpg";
img.title = "张学友思密达";
};
ldh.onclick = function () {
img.src = "images/ldh.jpg";
img.title = "刘德华";
};
</script>
</body>
2、表单元素的属性操作
利用表单DOM可以操作如下表单元素的属性:
type、value、checked、selected、disabled
2.1、获取属性的值
元素对象.属性名
2.2、设置属性的值
元素对象.属性名 = 值
表单元素中有一些属性如:disabled、checked、selected,元素对象的这些属性的值是布尔型。
2.3、示例
<body>
<button>按钮</button>
<input type="text" value="输入内容" />
<script>
// 1. 获取元素
var btn = document.querySelector("button");
var input = document.querySelector("input");
// 2. 注册事件 处理程序
btn.onclick = function () {
// 表单里面的值 文字内容是通过 value 来修改的
input.value = "被点击了";
// 如果想要某个表单被禁用 不能再点击 disabled 我们想要这个按钮 button禁用
// btn.disabled = true;
this.disabled = true;
// this 指向的是事件函数的调用者 btn
};
</script>
</body>
后记
如果你感觉文章不咋地
//(ㄒoㄒ)//
,就在评论处留言,作者继续改进;o_O???
如果你觉得该文章有一点点用处,可以给作者点个赞;\\*^o^*//
如果你想要和作者一起进步,可以微信扫描二维码,关注前端老L;~~~///(^v^)\\\~~~
谢谢各位读者们啦(^_^)∠※
!!!