zoukankan html css js c++ java

JavaScript DOM操作案例点击按钮a标签的链接跟热点文字

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title></title>
 6 </head>
 7 <body>
 8 <input type="button" value="修改链接跟文字" id="bt"/>
 9 <a href="www.taobao.com" id="a1">我是一个链接</a>
10 <script>
11     //根据id获取按钮元素,注册点击事件,添加事件处理函数
12     document.getElementById("bt").onclick = function () {
13         //根据id获取a元素
14         document.getElementById("a1").innerText = "这是一个a";
15         document.getElementById("a1").href = "www.baidu.com";
16     };
17 </script>
18 </body>
19 </html>

优化后的代码:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title></title>
 6 </head>
 7 <body>
 8 <input type="button" value="修改链接跟文字" id="bt"/>
 9 <a href="http://www.taobao.com" id="a1">淘宝</a>
10 <script>
11     //根据id获取按钮元素,注册点击事件,添加事件处理函数
12     //    document.getElementById("bt").onclick = function () {
13     //        //根据id获取a元素
14     //        document.getElementById("a1").innerText = "百度";
15     //        document.getElementById("a1").href = "http://www.baidu.com";
16     //    };
17     document.getElementById("bt").onclick = function () {
18         var aObj = document.getElementById("a1");
19         aObj.innerText = "百度";
20         aObj.href = "http://www.baidu.com";
21     };
22 </script>
23 </body>
24 </html>

查看全文

相关阅读:
测试报告M2
11.24Daily Scrum（4）
11.24Daily Scrum（3）
11.24Daily Scrum（2）
11.24Daily Scrum
11.22Daily Scrum（2）
11.22Daily Scrum
Echarts中graph类型的运用求教
 Echarts学习求教
 用node编写自己的cli工具

原文地址：https://www.cnblogs.com/cuilichao/p/9333127.html