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。如果我尝试删除像这样$('#mainWrap').children().removeAttr('id');的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属性。有一些方法可以通过（例如）直接使用错误数据调用Ajax请求中的URL来操纵JavaScript或绕过它。

所以你不应该只依赖你的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中查看。

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

1 个答案: