Question

我需要使用jQuery将HTML代码设置为html属性。

类似这样的东西：

$(".carousel").attr("data-dot","<button role="button" class="owl-dot"><?php 
include("inc/chart3.svg")?></button>");

但是转义有问题...我该如何解决这个问题？

Answer 1

这是您所有选项的详细分类。

双引号和单引号都可以用反斜杠转义：

 $(".carousel").attr("data-dot", "<button role=\"button\">");
 $(".carousel").attr("data-dot", '<button role=\'button\'>');

当然，您也可以根据情况（即您的情况）在双引号内使用单引号：

 $(".carousel").attr("data-dot", "<button role='button'>");

最后，单引号也可以放在双引号内

 $(".carousel").attr("data-dot", '<button role="button">');

编辑

使用转义字符串的一种好方法就是将内容插入浏览器控制台。

console.log("Here is a \"quote.\"");
console.log('Here is a "quote."');
console.log("Here is 'another quote.'");
console.log('Here is yet \'another quote.\'');

Answer 2

整理一下，如果您是这样的话：

let $btn = $("<button/>", {
    "role": "button",
    "class": "owl-dot",
    "html": "<?php include('inc/chart3.svg');?>"
});
$(".carousel").attr("data-dot", $btn.prop('outerHTML'));

console.log('carousel: ', $('.carousel').attr('data-dot'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="carousel"></div>

如何使用jQuery将HTML标签添加到属性中

2 个答案: