用javascript添加HTML标签

Adding HTML tag with javascript

本文关键字：标签 HTML 添加 javascript      更新时间：2023-09-26

我有一个问题，而动态添加html标签。我正在创建一个输入标签

var valueString = $("#className").val();
var htmlString = "<input type='hidden' id='class' name='class' value='"+ valueString +"' />"

现在的问题是，当"valueString"包含撇号(')时，创建的输入值与撇号断开。如何将变量附加为单个字符串?

如果我用双引号(")改变撇号(')，那么当变量包含双引号(")时就会出现问题。

不要通过将字符串混在一起来构建HTML，这是导致这类问题的主要原因。使用DOM(或jQuery包装器)代替。

var valueString = $('#className').val();
var $input = $("<input />", {
   type: "hidden",
   name: "class",
   value: valueString,
   id: "class"
});

然后可以将其附加到文档中。如果你真的需要一个HTML字符串，你可以:

var htmlString = $("<div />").append($input).html();


var valueString = "Example'" input' with special < characters >";
var $input = $("<input />", {
  type: "hidden",
  name: "class",
  value: valueString,
  id: "class"
});
var htmlString = $("<div />").append($input).html();
alert(htmlString);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

尝试正确连接single quote，

valueString = valueString.replace('/"/',"&#34;")
var htmlString = '<input type="hidden" id="class" name="class" value="'+ valueString +'" />';

作为新问题的解决方案，您必须将报价替换为相关的html编号。要替换它，简单的/"/正则表达式将有所帮助。如果您想替换所有实例，那么只需在regex的末尾添加g。

按以下格式使用

var valueString = $("#className").val();
$('<input />').attr('type','hidden').attr('id','class').attr('value',valueString).addClass('class');

在做任何你想做的事情之后，比如添加到dom或需要HTML和任何其他

相关文章：