节点属性及用JS修改各种选框的属性

最新推荐文章于 2023-05-11 11:05:57 发布

原创最新推荐文章于 2023-05-11 11:05:57 发布 · 498 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#DOM节点属性 #用JS修改各种选框的属性

课上笔记同时被 2 个专栏收录

11 篇文章

订阅专栏

备用笔记

5 篇文章

订阅专栏

本文详细介绍了如何在DOM中操作各种节点属性，包括设置和获取属性值的方法。涵盖了src、title、href等常见属性的JavaScript操作，以及单选、多选按钮和下拉框的选中状态控制。

节点属性

   HTML页面中 DOM中对应的属性
src ==>> src
title ==>> title
   href ==>>       href
   action ==>> action
alt ==>> alt
for ==>> htmlFor
   class ==>>   className

1.节点属性值的设置

节点对象.属性名=值;

设置节点属性值如:

var o=document.getElementById('ipt');
o.value='你好';

2.节点属性值的获取

节点对象.属性名

如:获取ID='slt'中的标签中的值


        var oS=document.getElementById('slt');
        var os=oS.value;
        console.log(os);

单选按钮

有checked属性的是选中

(注意:name相同时,才是排异的单选)

多选按钮

有checked属性时为选中

用js修改属性时 obj.checked=true;
true为勾中,
false为取消勾中

var oG=document.getElementById('ipt');
        oG.checked=true;//设置为勾中  false时取消勾中

下拉框

有selected属性是选中,
得到下拉框选中的值 (下拉框的id).value

        <select name="" id="slt">
            <option value="1">AAA</option>
            <option value="BBB" selected>BBB</option>
            <option value="3">CCC</option>
        </select>

js:

        var oS=document.getElementById('slt');
        console.log(oS.value);