0

簡単な説明があります - とても簡単に見えます...

ここに私の現在のツールチップがあります:

<div class="tooltip" style="position: absolute; top: 1298px; left: 382.5px; display: none; ">this is where the tooltiip text goes. You are quite the cool!</div>

インラインCSSがあるという事実を無視してください（申し訳ありません）...

わかりましたので、HTML の前に 1.5、後に 1.5 の 3 つのスパンを挿入する必要があるため、最終的には次のようになります。

<div class="tooltip" style="position: absolute; top: 1298px; left: 382.5px; display: none; "><span class="tooltop"></span><span class="toolmid">this is where the tooltiip text goes. You are quite the cool!</span><span class="toolbot"></span></div>

もちろん、これを行う最善の方法はわかりません...

基本的には次のようになります。

(既存の div) (開始スパン /) (中間スパン) [既存の innerHTML] (/ 中間スパン) (終了スパン /) (/既存の div)

わかりません。

4

4 に答える 4

3

wrapAll既存のコンテンツ、次にprepend上部とappend下部ができます

var tooltip = $('.tooltip');                            //cache tooltip

tooltip.contents().wrapAll('<span class="toolmid" />'); //wrap existing contents
tooltip.prepend('<span class="tooltop">');              //prepend the top
tooltip.append('<span class="toolbot">');               //append the bottom
于 2012-04-19T04:38:44.083 に答える
1

これを試して...

HTML

<div class="tooltip" style="position: absolute; top: 1298px; left: 382.5px; display: none; ">this is where the tooltiip text goes. You are quite the cool!</div>

JavaScript

$(".tooltip").each(function(index, tooltip) {
    tooltip.innerHTML = '<span class="tooltop"></span><span class="toolmid">' + tooltip.innerHTML + '</span><span class="toolbot"></span>';
});

このコードは、「tooltip」クラスを持つすべての要素を検索し、スパンに追加します。

于 2012-04-19T04:41:15.693 に答える
0 
$('<span class="tooltop"></span><span class="toolmid">' + someContentVariable + 
            '</span><span class="toolbot"></span>').
                         appendTo('your_div_selector');
于 2012-04-19T04:39:10.973 に答える
0 
$('.existing-div-selector')
    .append(
        $('<span class="tooltop"></span><span class="toolmid">' + someContentVariable + '</span><span class="toolbot"></span>')
    );

jQuery を使用すると、DOM 要素を解析して作成する文字列から DOM スニペットを作成できます。

于 2012-04-19T04:37:07.307 に答える