使用引号和单引号时使用的第三个字符

Question

我不知道是否已经有我还没有找到的解决方案，因为我不知道 quotes/singlequotes 的通用术语是什么，但是是否有第三个标志可以使用？

这是我的意思的一个例子：

我有一个 "copy text to clipboard" javascript，我通常在 html 中这样使用：

<a href="javascript:;" onclick="clipboardCopy('TextToCopy')">LinkName</a>

剪贴板复制脚本如下所示：

function clipboardCopy(text) {

    var textArea = document.createElement("textarea");
    textArea.value = text;
    document.body.appendChild(textArea);
    textArea.select();

    document.execCommand('copy');

    document.body.removeChild(textArea);

}

但是如果我想要另一个脚本在按下按钮时将这些链接打印到 div 中：

function CopyHtml() {
    document.getElementById('divname').innerHTML = "Links to print in div.";
}

由于引号和单引号都已被使用，因此将不允许这样做（如果我将双引号更改为单引号，那么我将单引号更改为什么？）。是否有第三个字符可用于此类问题？

Answer 1

您可以随时使用 \" 或 \' 进行转义。

那么如果你可能需要的话，你还有新的 ES6 `

console.log("he\"llo \"world");
console.log('he\'llo \'world');
console.log(`I'm a hello "world"`);

以你的情况为例，你可以简单地做：

document.getElementById('divname').innerHTML = `<a href="javascript:;" onclick="clipboardCopy('TextToCopy')">LinkName</a>`;

Answer 2

为了更简洁、更易于维护的代码，我强烈建议使用 addEventListener 正确附加侦听器，而不是使用与 eval 一样糟糕的内联处理程序。例如，你可以有一个像

这样的辅助函数

function copyOnClick(elm, text) {
  elm.addEventListener('click', () => {
    clipboardCopy(text);
  });
}

然后，而不是

<a href="javascript:;" onclick="clipboardCopy('TextToCopy')">LinkName</a>

你可以 select a 然后调用

copyOnClick(a, 'TextToCopy');

在 CopyHtml 中将元素附加到 divName 时，您可以做同样的事情。使用 createElement 显式创建元素，然后调用 copyOnClick:

function clipboardCopy(text) {
    var textArea = document.createElement("textarea");
    textArea.value = text;
    document.body.appendChild(textArea);
    textArea.select();
    document.execCommand('copy');
    document.body.removeChild(textArea);
    console.log('copied, check clipboard');
}

function copyOnClick(elm, text) {
  elm.addEventListener('click', () => {
    clipboardCopy(text);
  });
}

function CopyHtml() {
  const parent = document.getElementById('divname');
  [['text1', 'copy1'], ['text2', 'copy2']].forEach(([aText, aCopyText]) => {
    const a = parent.appendChild(document.createElement('a'));
    a.textContent = aText;
    copyOnClick(a, aCopyText);
  });
}

CopyHtml();

<div id="divname"></div>

这样，您不必担心任何属性值中的嵌套引号 - 您只需要 select 元素并添加所需的侦听器.

使用引号和单引号时使用的第三个字符

Third character to use when quote and single quote are in use

javascript

character

quotes