如何在JavaScript中创建链接（） _JavaScript开发

给定一个HTML文档, 任务是创建一个JavaScript链接, 并使用JavaScript将其添加到文档中。
方法：

创建锚点< a> 元素。
创建带有一些文本的文本节点, 该文本将显示为链接。
将文本节点附加到锚点< a> 元素。
设置< a> 元素的title和href属性。
在正文中添加< a> 元素。

范例1：在此示例中, 将通过JavaScript方法创建节点并设置属性。

< !DOCTYPE HTML> < html > < head > < title > How to create a link in JavaScript ? < / title > < / head > < body style = "text-align:center; " > < h1 style = "color:green; " > lsbin < / h1 > < p id = "GFG_UP" style = "font-size: 19px; font-weight: bold; " > < / p > < button onclick = "GFG_Fun()" > click here < / button > < p id = "GFG_DOWN" style = "color: green; font-size: 24px; font-weight: bold; " > < / p > < script > var el_up = document.getElementById("GFG_UP"); var el_down = document.getElementById("GFG_DOWN"); el_up.innerHTML = "Click on the button to generate " + "a link using JavaScript."; function GFG_Fun() {// Create anchor element. var a = document.createElement('a'); // Create the text node for anchor element. var link = document.createTextNode("This is link"); // Append the text node to anchor element. a.appendChild(link); // Set the title. a.title = "This is Link"; // Set the href property. a.href = "https://www.lsbin.org"; // Append the anchor element to the body. document.body.appendChild(a); } < / script > < / body > < / html >

输出如下：
在单击按钮之前：

文章图片
单击按钮后：

文章图片
范例2：此示例与上面的示例相似, 但是使用prepend()方法将锚点元素添加到主体。

< !DOCTYPE HTML> < html > < head > < title > How to create a link in JavaScript ? < / title > < / head > < body style = "text-align:center; " > < h1 style = "color:green; " > lsbin < / h1 > < p id = "GFG_UP" style = "font-size: 19px; font-weight: bold; " > < / p > < button onclick = "GFG_Fun()" > click here < / button > < p id = "GFG_DOWN" style = "color: green; font-size: 24px; font-weight: bold; " > < / p > < script > var el_up = document.getElementById("GFG_UP"); var el_down = document.getElementById("GFG_DOWN"); el_up.innerHTML = "Click on the button to generate " + "a link using JavaScript."; function GFG_Fun() {// Create anchor element. var a = document.createElement('a'); // Create the text node for anchor element. var link = document.createTextNode("This is link"); // Append the text node to anchor element. a.appendChild(link); // Set the title. a.title = "This is Link"; // Set the href property. a.href = "https://www.lsbin.org"; // Append the anchor element to the body. document.body.prepend(a); } < / script > < / body > < / html >

输出如下：
在单击按钮之前：