javascript - 如何围绕此附加行创建 Div？

Question

我有这行 jQuery:

$('.object1').append('<a href=" ' + linkURL + ' "> ' + headlineText + '</a>');

这会在网站上创建一个链接。

然后我想获取创建的链接并将其包装在特定于它的 div 中，类名为“linkdiv”。

有什么想法吗？我迷路了。

Answer 1

您可以将 div 包裹在字符串参数中的 a 周围，也可以使用 wrap()功能。

const linkURL = "someUrl";
const headlineText = "someText";
$('.object1').append('<div class="linkdiv"><a href="   ' + linkURL +  '   ">' + headlineText +  '</a></div>');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="object1">Here:</div>

Vanilla JS(不带 jQuery)解决方案:

const linkURL = "someUrl";
const headlineText = "someText";

// create div
const divEl = document.createElement("div");
divEl.classList.add("linkdiv");

// create link
const linkEl = document.createElement("a");
linkEl.href = linkURL;
linkEl.innerHTML = headlineText;

// append link to div
divEl.append(linkEl);

// append div to body
document.body.append(divEl);