如何查找由javascript生成的div的高度

Question

i have this file in which i want to find height of DIV with id "cpDocument" with the help of jquery. 我有这个文件，我想借助jquery查找ID为“ cpDocument”的DIV的高度。 This DIV can be seen inside documen.body.innerHTML in line number 46. 可以在documen.body.innerHTML内部的第46行中看到此DIV 。

index_scorm.html index_scorm.html

    <!DOCTYPE html>
<html lang="en">
<head>
<meta name='viewport' content='initial-scale = 1, minimum-scale = 1, maximum-scale = 1'/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="x-ua-compatible" content="IE=10">
<title></title>
<script src="../../jquery.min.js"></script>
<style type="text/css">#initialLoading{background:url(assets/htmlimages/loader.gif) no-repeat center center;background-color:#ffffff;position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;z-index:10010;}</style>

<script>

var deviceReady = false;
var initCalled = false ;
var initialized = false;

function onBodyLoad()
{
    if(typeof window.device === 'undefined')
    {
        document.addEventListener("deviceready", onDeviceReady, false);
    }
    else
    {
        onDeviceReady();
    }
}

function onDeviceReady()
{
    deviceReady = true ;
    if(initCalled === true)
        initializeCP();
}

function initializeCP()
{
    if(initialized)
        return;
    initCalled = true ;
    if(cp.pg && deviceReady === false)
        return;

    function cpInit()
    {
        document.body.innerHTML = " <div class='cpMainContainer' id='cpDocument' style='left: 0px; top:0px;' >  <div id='main_container' style='top:0px;position:absolute;width:100%;height:100%;'> <div id='projectBorder' style='top:0px;left:0px;width:100%;height:100%;position:absolute;display:block'></div>  <div class='shadow' id='project_container' style='left: 0px; top:0px;width:100%;height:100%;position:absolute;overflow:hidden;' >   <div id='project' class='cp-movie' style='width:100% ;height:100%;overflow:hidden;'>        <div id='project_main' class='cp-timeline cp-main'>         <div id='div_Slide' onclick='cp.handleClick(event)' style='top:0px; width:100% ;height:100% ;position:absolute;-webkit-tap-highlight-color: rgba(0,0,0,0);'></div>          <canvas id='slide_transition_canvas'></canvas>      </div>      <div id='autoplayDiv' style='display:block;text-align:center;position:absolute;left:0px;top:0px;'>          <img id='autoplayImage' src='' style='position:absolute;display:block;vertical-align:middle;'/>         <div id='playImage' tabindex='9999' role='button' aria-label='play' onkeydown='cp.CPPlayButtonHandle(event)' onClick='cp.movie.play()' style='position:absolute;display:block;vertical-align:middle;'></div>        </div>  </div>  <div id='toc' style='left:0px;position:absolute;-webkit-tap-highlight-color: rgba(0,0,0,0);'>   </div>  <div id='playbar' style='bottom:0px; position:fixed'>   </div>  <div id='cc' style='left:0px; position:fixed;visibility:hidden;pointer-events:none;' onclick='cp.handleCCClick(event)'>     <div id='ccText' style='left:0px;float:left;position:absolute;width:100%;height:100%;'>     <p style='margin-left:8px;margin-right:8px;margin-top:2px;'>        </p>        </div>      <div id='ccClose' style='background-image:url(./assets/htmlimages/ccClose.png);right:10px; position:absolute;cursor:pointer;width:13px;height:11px;' onclick='cp.showHideCC()'>     </div>  </div>  <div id='gestureIcon' class='gestureIcon'>  </div>  <div id='gestureHint' class='gestureHintDiv'>       <div id='gImage' class='gesturesHint'></div>    </div>  <div id='pwdv' style='display:block;text-align:center;position:absolute;width:100%;height:100%;left:0px;top:0px'></div> <div id='exdv' style='display:block;text-align:center;position:absolute;width:100%;height:100%;left:0px;top:0px'></div> </div>  </div></div><div id='blockUserInteraction' class='blocker' style='width:100%;height:100%;'> <table style='width:100%;height:100%;text-align:center;vertical-align:middle' id='loading' class='loadingBackground'>       <tr style='width:100%;height:100%;text-align:center;vertical-align:middle'>         <td style='width:100%;height:100%;text-align:center;vertical-align:middle'>             <image id='preloaderImage'></image>             <div id='loadingString' class='loadingString'>Loading...</div>          </td>       </tr>   </table></div> <div id='initialLoading'></div>";
        cp.DoCPInit();
        var lCpExit = window["DoCPExit"];
        window["DoCPExit"] = function()
        {
            if(cp.UnloadActivties)
                cp.UnloadActivties();
            lCpExit();
        };
    }

    cpInit();
    initialized = true;
}

</script>

 </head>
<body onload="onBodyLoad()">
        <div id='initialLoading'></div>
<script>
        (function()
        {
            if(document.documentMode < 9)
            {
                document.body.innerHTML = "";
                document.write("The content you are trying to view is not supported in the current Document Mode of Internet Explorer. Change the Document Mode to Internet Explorer 9 Standards and try to view the content again.<br>To change the Document Mode, press F12, click Document Mode: <current mode>, and then select Internet Explorer 9 Standards.");
                return;
            }
            window.addEventListener("load",function() 
            {
                setTimeout(function() 
                {                   
                    var script = document.createElement('script');
                    script.type = 'text/javascript';
                    script.src = 'assets/js/CPXHRLoader.js';
                    script.defer = 'defer';
                    script.onload = function()
                    {
                        var lCSSLoaded = false;
                        var lJSLoaded = false;
                        function constructDIVs()
                        {
                            if(lCSSLoaded && lJSLoaded)
                            {
                                initializeCP();
                            }
                        }
                        cpXHRJSLoader.css('assets/css/CPLibraryAll.css',function() {
                            lCSSLoaded = true;
                            constructDIVs();
                        });
                        var lJSFiles = [  'assets/js/jquery-1.6.1.min.js','scormdriver.js','assets/js/CPM.js' ];
                        cpXHRJSLoader.js(lJSFiles,function()
                        {
                            //console.log("js loaded");
                            lJSLoaded = true;
                            constructDIVs();
                        });
                    }
                    document.getElementsByTagName('head')[0].appendChild(script);
                },1);
            },false);
        })();

</script>
<noscript style="text-align:center;font-size:24px;">Enable Javascript support in the browser.</noscript>

</body>
</html>

Iam trying to do something like this with no luck: 我试图做这样的事情没有运气：

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
    $("body").on('load', function() {
        var mydiv = $("#cpDocument");
        var h     = mydiv.height();
        alert(h);
    });
    });
</script>

Answer 1

The script for finding the height of the element can be the last list of initializeCP() function eg. 查找元素高度的脚本可以是initializeCP()函数的最后一个列表，例如。

cpInit();
initialized = true;
var mydiv = $("#cpDocument");
var h     = mydiv.height();
alert(h);

如何查找由javascript生成的div的高度

问题描述

1 个解决方案

解决方案1
0 2016-09-04 13:03:06

如何查找由javascript生成的div的高度

问题描述

1 个解决方案

解决方案1 0 2016-09-04 13:03:06

解决方案1
0 2016-09-04 13:03:06