Я получаю двойные кавычки внутри атрибутов одинарных кавычек. Как я могу это остановить?

Question

У меня есть переменная, и я сохранил тег в этом.Я установил этот тег в двойных кавычках, и у моего тега есть некоторые атрибуты и события в одинарных кавычкахТеперь проблема в том, что я получаю двойные кавычки внутри тега, которые раньше были одинарными.Я хочу получить одинарные кавычки внутри тега некоторых атрибутов

var test= "<tr><td><input type='text' class='demo_class' onchange='myfun(this,'val')'></td></tr>"

Это дает мне результат в браузере

<input type="text" class="demo_class" onchange="myfun(this,"val")">

, но я хочу получить

<input type="text" class="demo_class" onchange="myfun(this,'val')">

Answer 1

Я получил решение, которое приведено ниже.

var test= "<tr><td><input type='text' class='demo_class' onchange='myfun(this,&apos;val&apos;)'></td></tr>"

Спасибо всем:)

Answer 2

Вам нужно экранировать кавычки, содержащиеся в том же типе кавычек с символом \ symbole.

Пример:

var test = '<tr><td><input type="text" class="demo_class" onchange="myfun(this,\'val\')"></td></tr>';

В противном случае строка, начинающаяся с 'или ", считается завершеннойпервый не экранированный 'или "встреченный.

Кроме того, кавычки, ограничивающие значения атрибутов html, всегда разрешаются как" независимые от того, что вы используете "или" в вашем js, так что вы можете избежать путаницы, всегда разделяя значенияиз ваших атрибутов html символом "как в этом примере.

document.body.innerHTML = '<input type="text" class="demo_class" onchange="myfun(this,\'val\')">';

Answer 3

Вы можете попробовать два подхода:

1. Используйте метод для очистки вашего HTML и отправьте test var через это: result = sanitize(test);.

   const sanitize = (str) => {
     return String(str)
       .replace(/"/g, "'");
   };
   

2. Попробуйте использовать сущности HTML в качестве " и литералов шаблона вместо простого символа кавычки.

const Q = """
let test= `<tr><td><input type=${Q}text${Q} class=${Q}demo_class${Q} 
onchange=${Q}myfun(this,${Q}val${Q})${Q}></td></tr>`

EDIT

Возможно, он будет работать с подходом интерполяции строк.

let test= `<tr><td><input type='text' class='demo_class' onchange='myfun(this, 'val')'></td></tr>`

Answer 4

var test = '<tr><td><input type=\"text\" class=\"demo_class\" onchange=\"myfun(this,\'val\')\"></td></tr>';