Question

我正在为JavaScript的.replace方法提供几个非常安全的正则表达式模式。输入是一个序列化的DOM字符串，我想删除所有YUI3 classNames和YUI3生成的id属性。

var resourceDOMStr = Y.DataType.XML.format( Y.Node.getDOMNode(this.getIframeDOMContainer()).innerHTML );
alert('unsanitized markup:\n\n'+resourceDOMStr );
// Remove YUI-added id's and classes
    // regex to remove ' id="*"'
    // regex to remove entire class attr: ' class="'yui3-*'"'
    // regex to remove className + trailing space: class="'yui3-* 'safeClass"
    // regex to remove className + leading space: class="safeClass' yui3-*'"
resourceDOMStr.replace('', '');
alert('sanitized markup:\n\n'+resourceDOMStr );

所以是的，我想要干净并删除整个id属性，其值始终以'yui_3'开头，例如; id="yui_3_3_0_1_1296949124608175"。此外，我想删除整个类属性，如果它唯一的类是YUI3生成的className，否则我只想删除YUI3 className和任何前导/尾随空格。生成的classNames将始终以'yui3-'，examples;

开头

class="yui3-dd-shim"
class="safeClass yui3-dd-shim"
class="yui3-dd-shim safeClass"

...我不希望'safeClass'被改变，我不想要建立前导/尾随空格，因为结果被替换的String将被多次加载，清理和保存

非常感谢任何头痛解决者。 d

编辑：

    <div id="wrap"><h1 id="yui_3_3_0_1_1296942015298202" class="yui3-dd-drop">Resource 1 Title</h1>
                            <p id="yui_3_3_0_1_1296942015298219" class="yui3-dd-drop">Lorem ipsum dolor sit amet, <a href="javacript:;" id="yui_3_3_0_1_1296942015298236" class="yui3-dd-drop">consectetur adipiscing</a> elit. Proin et sem leo, sed luctus nisi. Suspendisse pharetra iaculis laoreet. Pellentesque vulputate malesuada auctor. Integer laoreet ultricies nunc facilisis adipiscing.</p>

<div class="widget revealer">
        <p>Revealer widget.</p>
        <script type="text/javascript">
            document.RevealerConfig = true;
        </script>
    </div>

<div class="widget quiz safeClass" id="safeId">
        <p>Quiz widget.</p>
        <script type="text/javascript">
            document.QuizConfig = true;
        </script>
    </div>
                            <div class="snippet yui3-dd-drop" id="yui_3_3_0_1_1296942015298253">
                                Vestibulum fermentum, justo id porta suscipit, velit lorem hendrerit nisi, id tincidunt lectus ante quis lacus. Proin et erat sit amet turpis euismod dictum vitae a metus.
                            <div class="widget table">
        <p>Table widget.</p>
        <table width="80%" border="1">
            <tbody><tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>
            </tr>
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>
            </tr>
            <tr>
                <td>7</td>
                <td>8</td>
                <td>9</td>
            </tr>
        </tbody></table>
    </div></div>
                            <p id="yui_3_3_0_1_1296942015298270" class="yui3-dd-drop">Proin et sem leo, sed luctus nisi. Suspendisse pharetra iaculis laoreet. Pellentesque vulputate; laoreet ultricies nunc facilisis adipiscing ultricies nunc.</p>

<div class="widget table">
        <p>Table widget.</p>
        <table width="80%" border="1">
            <tbody><tr>
                <td>1</td>
                <td>
<ul>
<li>1</li>
<li>2<ul><li id="yui_2_0_0_1">nested</li></ul></li>
</ul>
</td>
                <td>3</td>
            </tr>
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>
            </tr>
            <tr>
                <td class="yui2-dd-drop yui3-dd-drop">7</td>
                <td class="yui2-dd-drop yui3-dd-drop">8</td>
                <td class="yui2-dd-drop yui3-dd-drop">9</td>
            </tr>
        </tbody></table>
    </div>
</div>

希望上面的内容都很好，不要太容易分开 - 正如下面的评论所述，它的示例HTML。

Answer 1

你可以尝试这种怪异：

var dirty = 'class="yui3-dd-shim" class="safeClass yui3-dd-shim" class="yui3-dd-shim safeClass"';

var clean = dirty.replace(/class="yui[0-9]-[^\s]+"|\s?yui[0-9]-[^\s"]+\s?|id="yui_[0-9][^"]+"/gi, '');

对您的样本数据进行了测试，似乎完成了这项工作。

安全的正则表达式来清理序列化的DOM？

1 个答案: