給定一個HTML文檔，如何使用JavaScript創(chuàng)建鏈接项栏，并將其添加到文檔中浦辨？下面本篇文章就來給大家介紹一下在HTML中使用JavaScript創(chuàng)建鏈接的方法，希望對大家有所幫助沼沈。
image
做法：
● 創(chuàng)建一個錨<a>元素流酬。
● 創(chuàng)建一個文本節(jié)點，其中包含一些將顯示為鏈接的文本列另。
● 將文本節(jié)點附加到錨<a>元素芽腾。
● 設(shè)置<a>元素的title和href屬性。
● 在body中追加<a>元素页衙。
示例1：使用appendChild()方法將錨a元素添加到正文
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body style="text-align:center;">
<p style="font-size: 19px; font-weight: bold;">單擊按鈕摊滔，可使用JavaScript生成鏈接</p>
<button onclick="Fun()">點擊這里</button>
<p id="DOWN" style="color: green; font-size: 24px; font-weight: bold;"></p>
<script>
var el_down = document.getElementById("DOWN");
function Fun() {
var a = document.createElement('a');
//為錨a元素創(chuàng)建文本節(jié)點
var link = document.createTextNode("這是鏈接！");
// 將文本節(jié)點追加到錨a元素
a.appendChild(link);
// 設(shè)置title.
a.title = "這是鏈接店乐！";
// 設(shè)置href屬性
a.;
// 將錨元素附加到body
document.body.appendChild(a);
}
</script>
</body>
</html>
效果圖：
1.gif
示例2：使用prepend()方法將錨a元素添加到正文
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body style="text-align:center;">
<p style="font-size: 19px; font-weight: bold;">單擊按鈕艰躺，可使用JavaScript生成鏈接</p>
<button onclick="Fun()">點擊這里</button>
<p id="DOWN" style="color: green; font-size: 24px; font-weight: bold;"></p>
<script>
var el_down = document.getElementById("DOWN");
function Fun() {
var a = document.createElement('a');
//為錨a元素創(chuàng)建文本節(jié)點
var link = document.createTextNode("這是鏈接！");
// 將文本節(jié)點追加到錨a元素
a.appendChild(link);
// 設(shè)置title.
a.title = "這是鏈接眨八！";
// 設(shè)置href屬性
a.;
// 將錨元素附加到body
document.body.prepend(a);
}
</script>
</body>
</html>
效果圖：
2.gif
