3

私はJavascriptが初めてです（プログラミングはできません）。私のページには、別々にうまく機能する2つの既製の関数があります。

  1. <p>一部の要素のフォントサイズを変更します。
  2. もう 1 つは魔法のように<p>要素を行に分割し、(現在のブラウザーの表示に見られるように) 各行を . で囲みます<span>。このようにして、ポインターが上にある行を強調表示できます。

最初の関数を使用してフォント サイズを大きくする (たとえば、ボタンをクリックする) と、行構造全体が変化し、<span>s が適切な場所に配置されなくなります。

したがって、基本的には、フォントサイズを増やすボタンで、2番目の関数のアクションを最初に「元に戻す」必要があります。

私の質問は、段落の改行を元に戻す ( <span>s を削除する) 関数を手動で作成する必要があるかどうか、または Javascript に関数が呼び出される前の時点にページを復元する機能があるかどうかです。

4

4 に答える 4

2

関数呼び出しを「元に戻す」ことはできません。あなたがしたいのは、次のpようにタグ内のHTMLタグを取り除くことです。

pelement.innerHTML = pelement.innerText;

それはすべてのspan要素を取り除きます。フォントサイズを増やして、後でspanify関数を適用できます。

Derija93による重要なヒント：この手法では、spanタグだけでなく、段落内のすべてのHTMLタグが削除されます。

jwatt1980によるもう1つの重要なヒントinnerTextは、100％クロスブラウザー互換ではないということです。詳細については、リンクを参照してください：http ://www.quirksmode.org/dom/w3c_html.html#t04

于 2012-08-04T22:38:06.533 に答える
1

組み込みの方法はありません。ただし、変更を変数に保存し、その変数を復元して元に戻すことができます。次の 2 つの例は少し複雑ですが、うまくいくと確信しています。

例 1 — コンテンツ全体を元のページ読み込み形式に復元します。

<script>
var orignalContent;

function setContent(content) {
    document.getElementById('changableContent').innerHTML = content;
}

function getContent() {
    return document.getElementById('changableContent').innerHTML;
}

function resetContent() {
    updateContent(originalContent);
}

window.onload = function() {
    originalContent = getContent();

    document.getElementById('resetButton').onclick = resetContent;
};
</script>

例 2 — 変更ごとに変更をリセット (大きな変数に実行される可能性があります...元に戻す手順を制限する方法を追加できます)

<script>
var contentChanges;

function setContent(content, save) {
    if(save !== false) {
        contentChanges.push(content);
    }
    document.getElementById('changableContent').innerHTML = content;
}

function undoChange() {
    setContent(contentChanges.pop(), false);
}

window.onload = function() {
    document.getElementById('undoButton').onclick = undoChange;
};
</script>
于 2012-08-04T22:47:25.610 に答える
0

addSpans コードを変更して、addSpans のみが使用するスパンにクラスを追加します。undoSpans という新しい関数を作成します。jquery を使用して、そのクラスのすべての要素を取得することにより、すべてのスパンを取得します。次に、.innerHTML() を呼び出して結果を親ノードに挿入し、スパンを削除して、それらを反復処理できます。この時点で、フォントのサイズ変更を行ってから再スパンできます。

于 2012-08-04T23:08:54.930 に答える