首页 > 代码库 > JS的属性操作（2）

JS的属性操作（2）

2024-09-22 18:26:25   220人阅读

1.点击下拉框选择信息

技术分享

2.点击按钮，下拉框内选择的信息会自动跳转到文本输入框

技术分享

 

技术分享 
 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>无标题文档</title>
 6 
 7 <script>
 8 /*
 9     HTML 的属性操作：读、写
10         属性名：
11         属性值：
12         
13         读操作：获取、找到
14         元素.属性名
15         
16         写操作：“添加？”、替换、修改
17         元素.属性名 = 新的值
18         
19 */
20 window.onload = function (){
21     var oBtn = document.getElementById(‘btn1‘);
22     var oText = document.getElementById(‘text1‘);
23     var oSelect = document.getElementById(‘select1‘);
24 
25     oBtn.onclick = function (){
26         //oBtn.value = http://www.mamicode.com/‘button‘;
27         //oText.value = http://www.mamicode.com/123;
28         oText.value =http://www.mamicode.com/ oSelect.value;
29     };
30 };
31 </script>
32 
33 </head>
34 
35 <body>
36 
37 <input id="text1" type="text" />
38 <select id="select1">
39     <option value="http://www.mamicode.com/北京">北京</option>
40     <option value="http://www.mamicode.com/上海">上海</option>
41     <option value="http://www.mamicode.com/杭州">杭州</option>
42 </select>
43 <input id="btn1" type="button" value="http://www.mamicode.com/按钮" />
44 
45 </body>
46 </html>
示例代码：

 

JS的属性操作（2）


联系
我们