Question

我最近已经从HTML切换到XHTML ...不要让我开始“为什么” - 让我们说它不是一个选项。安美居...

当我是HTML时，此功能在IE和FF中运行良好，但现在使用XHTML我在FF中收到以下错误：

heightElement is undefined

现在这里是我定义 heightElement

的陈述

function revBars(isEFBOutput, isIXPPreview) {
  if (!isIXPPreview) isIXPPreview = false;
  var heightElement =
    $('<div id="resizeDetectingElement" style="position:absolute; left:-9999999px height:1em;">&#160;</div>')
      .prependTo('body')
      .get(0);
  heightElement.currentHeight = heightElement.offsetHeight;  // FireBug says the error is here.
  insert();
  window.onresize = refresh;
  setInterval(
    function() {
        if (heightElement.currentHeight != heightElement.offsetHeight) {
            heightElement.currentHeight = heightElement.offsetHeight; refresh();
        }
    }, 500);

function insert() {
    var px = "px";
    var color = (document.styleSheets[0].href.match("ftidStyleDay")) ? "black" : "white";
    $revMarks = $('.RevMark').removeClass('RevMark').addClass('UnMarked');
    if (!$revMarks.length) $revMarks = $('.UnMarked');
    $revMarks.each(function() {
        $('<div class="RevBar" />').css({
            'background-color': color,
            'width': '2px', 'position': 'absolute',
            'left': (isEFBOutput && !isIXPPreview ? '.25em' : '-.75em'),
            'height': this.offsetHeight,
            'top': offset(this) + px
        }).prependTo('body');
    });
}

function refresh() { $('.RevBar').remove(); insert(); }

function offset(obj) {
    var top = 0;
    if (obj.offsetParent) {
        do {
            top += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    if (document.all && (!isEFBOutput || (isEFBOutput && isIXPPreview))) top -= 15;
    return top;
}

}

为什么这会在FF中的XHTML中抛出错误？它仍然适用于IE。

编辑：此外，此代码在FF 和 IE中完美运行，直到我切换到XHTML。 Firefox仍然为XHTML创建一个DOM，对吗？

Answer 1

我重写了一些你的例子，因为你有错误，并且不完整的函数调用不在例子中：

$(document).ready( function(){
    function revBars(isEFBOutput, isIXPPreview){
        var test = "<div id=\"someElement\">whatever</div>";
        $('body').prepend(test).get(0);
        var heightElement = $('#someElement');
        console.log( heightElement);
    }
    revBars();
});

此时heigthElement存在，div被添加到DOM。请提供正确的问题以便解决问题。

<强>更新

//var heightElement = $('<div id="resizeDetectingElement">whatever</div>').prependTo('body').get(0); 
// this statement doesn't work
var heightElement = $('body').prepend('<div id="resizeDetectingElement">whatever</div>'); 
// this does
console.log(heightElement);

这与第一个例子基本相同。

您所做的请求是在元素主体之前添加div，然后获取正文的第一个元素。 prependTo已经返回匹配的项目，因此获取是相关的。而且你在身体之前附加一个元素，所以你的变量是空的是正常的。

尝试使用我的代码并移除downvote，因为许多人对您的超级代码没有这种耐心。

更新2 这是prepend（）和prependTo（）的用法示例。

<html>
<head>
    <script type="text/javascript" src="../lib/jquery/jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
    $(document).ready( function(){
        $("#test_A").prepend('<div id=\'test_B\'>B</div>');
        $("#test_C").prependTo( $('#test_A'));
        var x = $('<div id="resizeDetectingElement">D</div>').prependTo('body').get(0);
        console.log( x ); // returns the div
        $(x).append('some text'); //works
    });
</script>
</head>
<body>
<div id='test_A'>A</div>
<div id='test_C'>C</div>
</body>
</html>

我希望这有助于使您的代码正常运行。 USE $（heightElement）不仅仅是heightElement，它不是jQuery对象的div。

FireFox中的jQuery困难＆amp; XHTML

1 个答案: