php - 在将它们保存到数据库之前从 HTML 元素中删除 ID

Question

我正在开发一个可以保存用户创建的 HTML 模板的应用程序。在这里，用户将拥有一些 HTML 组件供他使用，并且能够使用这些组件创建静态 HTML 页面。

我正在使用 javascript 函数自动保存页面内容。

     function saveContent(){    
        //var getContent=$('#mainWrap').children().removeAttr('id');
        var $getContent=$('#mainWrap');
        var $finalContent=$getContent.children().removeAttr('id');
        var auto="auto";
        var pageId = <?php echo $pageId;?>; 
        var webId  = <?php echo $webId;?>;
        var userId = <?php echo $userId;?>;
        $.ajax({
            url:"auto_save.php",
            type:"POST",
            dataType:"text",
            data:"txtComp="+$('#mainWrap').html()+"&auto="+auto+"&pageId="+pageId+"&webId="+webId+"&userId="+userId
        }); 
    }   

    var interval = 1000 * 60 * 0.30; // where X is your every X minutes
    setInterval(saveContent,interval);

问题:我想从用户保存的 HTML 组件中删除 ID，因为 ID 是自动生成的，在用户发布模板时不需要(创建后在他的域上)。我有一个主包装器，用于包装整个页面，称为 id=mainWrap。如果我尝试像这样删除 IDs $('#mainWrap').children().removeAttr('id'); 它们也会从 DOM 的当前上下文中删除，即它们是从用户正在编辑其模板的页面中删除。

问题:如何在不影响 mainWrap 对象的当前上下文的情况下从 HTML 元素中删除 ID？

我试过像这样将它分配给另一个对象

    var $getContent=$('#mainWrap');
    var $finalContent=$getContent.children().removeAttr('id');

还是失败了

关于这是否可能的任何评论或更正？还是我的做法有误？

更新:问题在一定程度上得到了解决。 接下来我想在用户返回编辑页面时添加 id。 我使用这段代码得到了上面保存的内容

    <?php
    $sqlEdit = "select revisionContent from tbl_revision where revisionId='".$_SESSION['contentId']."'"; //The query to get the record
    $rsEdit = $dbObj->tep_db_query($sqlEdit);//The database object to execute the query   
    $resEdit = $dbObj->getRecord($rsEdit);                                                                                       
    $IdLessContent = $resEdit['revisionContent'];//Variable with the record

     ?>

现在，我想在 javascript 中使用这个 PHP 变量，所以我这样做了。

  <script language="javascript">
    var getSavedContent = '<?php echo json_encode($IdLessContent); ?>';
    var trimmedCont=($.trim(getSavedContent).slice(1));
    //console.log(trimmedCont);
    var lengthCont= trimmedCont.length;
    var trimmedCont=$.trim(trimmedCont.slice(0,lengthCont-1));
    var pageContent=$('<div class="addId">').append(trimmedCont);  //Here I tried creating a div dynamically and appending the content to the div.But now I am not able to manipulate or work on this dyamic div and get NULL when I alert saying $('.addId').html();
    $('.addId').children().attr('id', 'test');               //I tried doing this but does not work

这是行不通的。你能解释一下吗

Answer 1

您可以循环遍历 #mainWrap 中的元素并删除 id，例如:

var getContent = $('#mainWrap');
var finalContent = getContent.parent().clone().find('*').removeAttr('id');

示例:http://jsfiddle.net/7m8g4/6/

出于安全考虑，您应该意识到这是一个从 html 中删除 id 属性的客户端脚本。有一些方法可以操纵 JavaScript 或通过(例如)直接使用虚假数据调用 Ajax 请求中的 URL 来绕过它。

所以你永远不应该只依赖你的 JavaScript。如果由于任何原因 JavaScript 未按预期运行，请确保您的代码不会导致问题。例如，您可以通过搜索 id 属性(使用 regex )来执行此操作，并在仍然找到一些 id 属性的情况下生成错误消息。另一种方法是在服务器端(在 PHP 中)删除它们(如果找到的话)。为此，您可以进行正则表达式搜索并用空字符串或使用子字符串替换匹配项。由你决定!

希望这一切都有意义!

编辑

如果你想稍后添加新的 id 属性，你可以这样做:

var newContent = $(finalContent).first().wrap('<div class="addId" />');
newContent = $(newContent).parent().find('*').each(function(index, value) {
   $(this).attr('id', index);
});

在工作中看到 here .