Question

我需要操纵HTML代码。具体来说，用户应该能够复制/粘贴代码以在textarea中创建AddThis按钮，并且我想操纵粘贴的代码。

典型的AddThis按钮如下所示：

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_clickback":true};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-123456798"></script>
<!-- AddThis Button END -->

它包括开始和结束注释，div和/或一些链接，后跟2个脚本：配置设置和对其库的调用。

问题是，我们需要在页面上多次调用它;所以，如果我每次想要放置一个AddThis按钮时都放这个，我担心至少有些浏览器会有奇怪的行为，如果它可以工作的话。

所以，我想提取配置设置和lib调用，所以我只需要调用它们一次，并提取按钮配置，这样我就可以在页面上多次放置它。

我已经这样做了：

    var codeAT = $(this).val();
    if (codeAT.indexOf("AddThis Button BEGIN") >= 0) {
        codeAT = codeAT.replace("&lt;", "<");
        codeAT = codeAT.replace("&gt;", ">");

        codeAT = $(codeAT);

        // extract the call to the config var and the lib
        var scriptConfig = "";
        var scriptSRC = "";
        codeAT.each(function() {
            if ($(this).attr("nodeName") == "SCRIPT") {
                if ($(this).attr("src") && $(this).attr("src") != "") {
                    scriptSRC = $(this).attr("src");
                } else {
                    scriptConfig = $(this).text();
                }
            }
        });

        // extract the addthis identifier
        scriptSRC = scriptSRC.split("=")[1];
    }

现在，我可以使用vars scriptConfig（带var addthis_config = {"data_track_clickback":true};）和scriptSRC（带ra-123456789），它们具有正确的值。

我现在想要的是原始代码（两条评论之间），没有评论，没有脚本标签。

要删除标记，我尝试使用codeAT.remove($(this))，但它崩溃了（关于c.replace不是函数的东西）。

为了获取代码，我尝试了codeAT.html()，但它只获取了代码。

Answer 1

而不是.each（）我会这样做：

//remove <script> tags and get required info
var scriptSRC = $('script[src]', codeAT).remove().attr('src');
var scriptConfig = $('script:not([src])', codeAT).remove().text();

//get the code (as string)
var code = $('<div>').append(codeAT).remove().html();

操纵DOM元素以提取一些节点并删除其他节点

1 个答案: