Question

问题：我无法修改我在函数中创建的HTML元素。

代码：

我读过我可以用这种方式从字符串创建一个元素。

var base_html = $("<div id='base'><div id='chart_container_bars'></div>"+
                      "<br>"+
                      "<br>"+
                      "<div id='chart_container_lines'></div>"+
                      "<table class='table table-bordered' id='tabla_servicios' style='width:100%; padding:12px'>"+
                      "</table>"+
                    "</div>");

所以我假设我可以使用选择器来修改这段HTML代码。

var tabla_servicios = base_html.find($("#tabla_servicios"));
tabla_servicios.html("<p>HI</p>");

然后将HTML返回到包含以下内容的字符串：

var html_str = base_html.html();

但我还没有能够做到。

期望的结果：

var final_html_str = $("<div id='base'><div id='chart_container_bars'></div>"+
                      "<br>"+
                      "<br>"+
                      "<div id='chart_container_lines'></div>"+
                      "<table class='table table-bordered' id='tabla_servicios' style='width:100%; padding:12px'>"+
                      "<p>HI</p>"+
                      "</table>"+
                    "</div>");

问题：

有没有办法从字符串创建HTML元素，然后用选择器修改它？

Answer 1

在jquery find函数中，你必须将选择器作为字符串传递。

var base_html = $("<div id='base'><div id='chart_container_bars'></div>"+
                      "<br>"+
                      "<br>"+
                      "<div id='chart_container_lines'></div>"+
                      "<table id='tabla_servicios' class='table table-bordered' id='tabla_servicios' style='width:100%; padding:12px'>"+
                      "</table>"+
                    "</div>");

var tabla_servicios = base_html.find("#tabla_servicios");
tabla_servicios.html("<p>HI</p>");

var html_str = base_html.html();

console.log(html_str);

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

在jQuery中修改jQuery中创建的html元素

1 个答案: