1
<!DOCTYPE html>
<html><body>

<p id="intro">Hello <em id="abcd">intro</em> World!</p>

<script type="text/javascript">
var txt=document.getElementById("intro").innerHTML;
var el = document.createElement("span");
el.innerHTML = txt;
var aa = el.getElementById("abcd").innerHTML;
alert( aa );
</script>
</body></html>

上記は簡単なスニペットです。実際、私は HTML エディターを持っています。ユーザーがデータを保存するときは、必要なコンテンツのみを保存する必要があります。ここでは、要素のコンテンツを取得して DOM で操作し、詳細をサーバーに渡します。このようにして、私はページのコンテンツを変更せず (ユーザー ビューは同じまま)、ドキュメントの編集を続行します。

上記は簡単な例ですが、実際には特定の要素を削除、変更、および移動する必要があります。上記のコードは失敗しますel.getElementById("abcd").innerHTML。ポインタに感謝します。

4

3 に答える 3

0

以下のようなjQueryを使用してみてください。

  function SaveData() //Your add function
    {
       var txt=$("#intro").html();
       $(document).append("<span id='abcd'>" + txt+ "</span>");
       var aa = $("#abcd").hmtl();
       alert(aa);
     }
于 2012-08-31T09:01:36.977 に答える
0

DOM に追加されない DOM 要素を使用できます。私はこの「クリーンアップ」機能を使用します:

  function cleanup(str){
    var tester = document.createElement('div'),
        invalid, result;
    tester.innerHTML = str;

    //elements I don't allow
    invalid = tester.querySelectorAll('script,object,iframe,style,hr,canvas');

    // the cleanup (remove unwanted elements)
    for (var i=0;i<invalid.length;(i+=1)){
      invalid[i].parentNode.removeChild(invalid[i]);
    }

    result = tester.innerHTML;
    tester = invalid = null;

    //diacritics to html-encoded
    return result.replace(/[\u0080-\u024F]/g,
                          function(a) {return '&#'+a.charCodeAt(0)+';';}
                         )
                 .replace(/%/g,'%25');
  }
  //usage:
  cleanup(document.getElementById("intro").innerHTML);

独自のコードで関数を拡張して、特定の要素を削除、変更、および移動できます。

于 2012-08-31T09:12:31.460 に答える
0

非表示の iframe を作成してすべての変更を操作し、別の DOM を作成してから、必要な結果を簡単に取得できます。

var iframe;
if (document.createElement && (iframe = document.createElement('iframe'))) {
    iframe.name = iframe.id = "externalDocument";
    iframe.className = "hidden";
    document.body.appendChild(iframe);

    var externalDocument;
    if (iframe.contentDocument) {
        externalDocument = iframe.contentDocument;
    } else if (iframe.contentWindow) {
        externalDocument = iframe.contentWindow.document;
    }
    else if (window.frames[iframe.name]) {
        externalDocument = window.frames[iframe.name].document;
    }

    if (externalDocument) {
        externalDocument.open();
        externalDocument.write('<html><body><\/body><\/html>');
        externalDocument.close();

        /* Run your manipulations here */
        var txt = document.getElementById("intro").innerHTML;
        var el = document.createElement("span");
        el.innerHTML = txt;

        /* Attach your objects to the externalDocument */
        externalDocument.body.appendChild(el);

        /* Reference the externalDocument to manipulate */
        var aa = externalDocument.getElementById("abcd").innerHTML;
        alert(aa);
    }

    /* Completed manipulation - Remove iFrame */
    document.removeChild(iframe);
}

ここで動作しています: http://jsfiddle.net/ucpvP/

于 2012-08-31T08:59:20.690 に答える