2

javascript を使用してスパンのコンテンツを変更すると、この変更は Webkit ブラウザーでレンダリングされません。

これは、ラッパー スパンが相対配置され、絶対配置され、幅と高さが固定されている内部スパンを含む場合にのみ適用されます。

バグの最も単純な例を次に示します (Chrome や Safari などの Webkit ブラウザーで確認してください)。

<!DOCTYPE HTML>
<html>
    <head>
        <title>Webkit render bug</title>
        <style type="text/css">
            .wrapper {
                position: relative;
            }

            #absolute-block {
                display: block;
                position: absolute;
                width: 152px;
                height:42px;
                background-color: #EEEE00;
                color: #FF0000;
            }

        </style>
    </head>
    <body>
        <h1>Webkit render bug</h1>
        <button onclick="document.getElementById('absolute-block').innerHTML = 'Update test';">Update test</button>
        <span class="wrapper">
            Some content
            <span id="absolute-block">Absolute-block</span>
        </span>
    </body>
</html>

ボタンをクリックすると、DOM ツリーのスパンのコンテンツが置き換えられますが、Chrome や Safari などの Webkit ベースのブラウザーではレンダリングされません。他のブラウザには、このレンダリング バグはありません。

これが近い将来修正されるかどうかは誰にもわかりませんか？それとも、このブラウザの問題を回避したほうがよいのでしょうか?

4

0 に答える 0