Question

可以使用jquery函数轻松地将字符串转换为树，操纵节点并转换回字符串吗？

原始问题：如何使用jquery函数如selector和.html（）用于字符串操作？

更新

我找到了相关信息这个问题parse html string with jquery
Ben Alman有一个例子 replaceText作为jquery插件走树然后替换文本
此question and answer有关如何将jquery对象转换为字符串的其他见解

首先可以使用jquery进行以下操作吗？（我稍后会核实）

var b = $('<a href="#">bacon</a>').html();

b ==='培根'，答案是肯定的。

如何使用jQuery执行字符串操作:(从a sample highlighting answer修改）

var key = 'bacon';
var str = '<a href="#">bacon</a><a href="#">tastes great</a>';
$(str).contents().each(function() {
  var node = this;
  if (node.nodeType == 3) {
    var text = node.nodeValue;
    text = text.replace(new RegExp(key, "g"),
            '<span class="Someclass">'+key+'</span>'
        ));
    //replace existing node value with text
});
// convert tree into string

所需的输出是带有修改元素的字符串：

str = '<a href="#"><span class="Someclass">bacon</span</a><a href="#">tastes great</a>';

Answer 1

是的，但您需要.html()代替：

var b = $('<a href="#">bacon</a>').html();
// Or,
var b = $('<a href="#">bacon</a>')[0].innerHTML;

至于第二个例子：

$('<a href="#">bacon</a>').html(function (i, oldHtml) {
    return oldHtml.replace(/(bacon)/g, '<span class="SomeClass">$1</span>');
});

Answer 2

我会说“不完全”。您正在尝试进行的具体更改可以像Box9所示完成，但就语义而言，我会说您不使用jQuery进行字符串操作，据我所知。

jQuery可用于读取和修改DOM，并且部分存在以使该流程跨浏览器标准化。

一旦你读了DOM，但在你更新它之前，你解析和改变它的部分可以通过操作字符串来完成，但实际的字符串操作将是普通的Javascript。

Answer 3

我已阅读此问题及相应的评论＆amp;现在连接几次，我仍然不确定实际问题是什么，但是......

可以轻松使用jquery函数将字符串转换为树，进行操作一个节点，并转换回一个字符串？

是

诀窍是使用包装器元素，以及jQuery html（）和text（）方法。 Here is a fiddle向您展示我的意思。

有时，您希望使用文本来获取元素中的所有文本，而不会抓取所有子元素，例如wrap＆lt; b＆gt;或者＆lt; i＆gt;标签。在它是一个dom元素之后，您可以使用dom操作来追加，添加类，修改属性以及所有类型的东西，然后再将其转换回字符串。

这是你要找的答案吗？

编辑：Doh！我在打字时得到了答案

Answer 4

使用Ben Alman's replaceText和object to html string转换器黑客

工作

function one() {
    var key = 'bacon';
    var str = '<a href="#">bacon nation</a> <a href="#">tastes good</a>';
    dump("before str contents: " + str);
    str = $(str).replaceText(new RegExp(key,"gi"),'<span class="SomeClass">' + key + '</span>');
    str = $('<div>').append($(str).clone()).remove().html();
    dump("after str contents: " + str);
}

和所需的输出：

<a href="#"><span class="SomeClass">bacon</span> nation</a><a href="#">tastes good</a>

我已经包含了主要调用html +脚本的完整性

    <style type="text/css"> .SomeClass { background-color: yellow } </style>
    <script type="text/javascript">
        function dump(str) {
            $('<div>' + str + '<br/></div>').appendTo('body');
        }
    </script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.ba-replacetext.js"></script>
    <script type="text/javascript" src="test.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            one();
        });
    </script>

可以使用jquery函数轻松地将字符串转换为树，操作节点并转换回字符串吗？

4 个答案: