JS练习---对selec下拉框操作

HTML代码

<select id="sel1">
        <option value="选择">选择</option>
        <option value="河南省" selected>河南省</option>
        <option value="韩国">韩国</option>
</select>

JS方法

获得下拉框的节点对象

var obj = document.getElementById("sel1");
console.log(obj);

获取当前选中的值

sel1.onchange = function () {
    var value = obj.value;
    console.log(value);
}

获得该下拉框所有的option的节点对象

var options = obj.options;
console.log(options);//得到数组对象

获取第一个option的value值

var value1 = options[0].value;
console.log(value1);

获取第一个option的text值

var text1 = options[0].text;
console.log(text1);

获取当前选中option的索引

var index = obj.selectedIndex;
console.log(index);

获取当前选中option的text内容

sel1.onchange = function () {
    var index = obj.selectedIndex;
    console.log(index);
    var selectedText = options[index].text;
    console.log(selectedText);
}

结束语:别想一下造出大海,必须先由小河川开始。

posted @ 2020-07-22 15:37  棘手的金苹果  阅读(189)  评论(0)    收藏  举报