Javascript jQuery使用.html（）选择innerHTML后编辑它

我使用PHP从DB动态生成行，一旦它编译了初始页面，代码如下所示：

片段

<div class="options" id="options">
        <div class="left_wrap">
            <ul>
                <li class="col_id b-bottom"></li>
                <li class="hazard_header"><h3>Hazard</h3></li>
                <li class="hazard_input b-bottom"></li>
                <li class="con_header b-bottom"><h3>Controls</h3></li>
                <li class="cat_header"><h3>Consequence Category</h3></li>
                <li class="cat_options"></li>
            </ul>
        </div>
        <div class="right_wrap">
            <h2>Inherent Risk (Assessed risk without controls)</h2>
            <ul class="fields">
                <li class="bg b-top b-right"><h3>Consequence Level</h3><br/><span class="con_level_val"></span></li>
                <li class="b-top b-right"><h3>Probability</h3><br/>Possible</li>
                <li class="bg b-top b-right"><h3>Exposure (frequency)</h3><br/></li>

依次将上述代码存储在变量

content

中。现在，我的问题是如何编辑变量

content

的内容。例如，我需要使用class

Col_ID

向

li

添加值，如1,2,3,4，删除时需要再次修改内容

---

我如何按照

content.getElement

？

的思路做一些事情如果您真的需要使用HTML字符串，以下是您可以做的事情：

content = $("div.options").html();
var $content = $(content);
// now $content is a jQuery object with a bunch of (detached) elements
// you can use the common functions on it without problems, such as
$content.find("li.col_id").text("Some text");

// now you need to do something with $content, or everything you did will...
// ...be lost. You cold, for instance, update the other variable back:
content = $content.html();
// content now has the updated HTML

现在，如果您根本不需要HTML字符串，那么您可以像这样直接工作：

content = $("div.options");
content.find("li.col_id").text("Some text");
// now the DOM was already updated as you are dealing with attached elements

---

你说的商店是什么意思？你真的需要那个HTML字符串吗？如果省略

.html（）

变量，您将有一个对完全可用的jQuery对象的引用，该对象允许使用类似

.find（）

的方法，这似乎正是您想要的。我发现使用jQuery对象要容易得多。。。正如@acdcjunior所提到的，您不需要html，您可以通过

var options=$（“div.options”）；

获取整个对象，然后使用find方法获取特定对象：

options.find（“ul.fields”）；

您也可以很容易地在JQuery中创建对象修改元素并将其重新包装。此应用程序所做的是一种excel工作表，用户可以添加和删除行以及编辑列。非常感谢，这甚至比我尝试做的更好：）

content = $("div.options");
content.find("li.col_id").text("Some text");
// now the DOM was already updated as you are dealing with attached elements