这个疯狂的 jQuery 选择器相当于什么？
[英]What is the equivalent of this mad jQuery selector?
问题描述
I'm trying to convert some jQuery into vanilla JavaScript, but this one just stumped me:
我正在尝试将一些 jQuery 转换为香草 JavaScript，但这只是让我难过：
$('<span>[<a href="#" id="addlink">Add</a>]</span>')
2 个解决方案
解决方案1
2
It's not a selector, it creates the DOM elements from this markup and wraps it in a jQuery object.它不是一个选择器，它从这个标记创建 DOM 元素并将其包装在 jQuery object 中。 See the docs .请参阅文档。
const $el = $('<span>[<a href="#" id="addlink">Add</a>]</span>'); console.log( $el.html() ); $("body").append( $el );
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
So the vanilla equivalent would be所以香草等价物是
const span = document.createElement("span"); const a = document.createElement("a"); a.href = "#"; a.id = "addlink"; a.textContent = "Add"; span.append( "[", a, "]" ); document.body.append( span );
解决方案2
0 2020-12-29 07:36:18
The Vanilla Javascript approach for the same could also be achieved using setAttribute() , createTextNode() and appendChild() as follows. Vanilla Javascript 方法也可以使用setAttribute() 、 createTextNode()和appendChild()来实现，如下所示。 Just another way to do this.只是另一种方法。
const span = document.createElement("span"); const a = document.createElement("a"); a.setAttribute("href", "#"); a.setAttribute("id", "addlink"); const text = document.createTextNode("Add"); a.appendChild(text); span.append("[", a, "]"); document.body.appendChild(span);
<,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width. initial-scale=1.0" /> </head> <body> <script src="./script.js"></script> </body> </html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.