Javascript 如何用document.getElementById（'ElementID'）.innerHTML替换document.write

只是想让你知道我不是程序员。我试图理解一些代码，并在我可以使用试错法的地方对其进行修改。 我有一段来自Joomla模块的代码，我需要在其中更改函数：函数pausescroller用于document.getElementById'ElementID'.innerHTML的document.write函数，我不知道如何更改。我正在发布函数pausescroller的代码，我在那里尝试实现上述w/o luck。前端不显示任何内容：

function pausescroller(content, divId, divClass, delay){
  this.content=content //message array content
  this.tickerid=divId //ID of ticker div to display information
  this.delay=delay //Delay between msg change, in miliseconds.
  this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over scroller (and pause it if it is)
  this.hiddendivpointer=1 //index of message array for hidden div
  document.getElementById('divId').innerHTML = "<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>";
  //document.write('<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>')
  var scrollerinstance=this
  if (window.addEventListener) //run onload in DOM2 browsers
    window.addEventListener("load", function(){scrollerinstance.initialize()}, false)
  else if (window.attachEvent) //run onload in IE5.5+
    window.attachEvent("onload", function(){scrollerinstance.initialize()})
  else if (document.getElementById) //if legacy DOM browsers, just start scroller after 0.5 sec
    setTimeout(function(){scrollerinstance.initialize()}, 500)
}

下面是整个JavaScript部分的代码：

<script type="text/javascript">
<!--
var pausecontent=new Array();
var cnti = 0;

<?php
for($im=0; $im<count($testi_RSMSC); $im++) {
    $dateExp_RSMSC = explode('-', $testi_RSMSC[$im]['date']);
    $timestamp_RSMSC = mktime(12,0,0,$dateExp_RSMSC[1],$dateExp_RSMSC[2],$dateExp_RSMSC[0]);
    $dateConfig_RSMSC = JFactory::getConfig();
    $siteLang_RSMSC = $dateConfig_RSMSC->get('config.language');
    setlocale(LC_ALL, $siteLang_RSMSC);
    $dateView_RSMSC = strftime("%d %B %Y", $timestamp_RSMSC);
    $testi_RSMSC[$im]['comment'] = preg_replace('/\s\s+/', ' ', trim($testi_RSMSC[$im]['comment']));
    $testi_text = '';
    if($char_RSMSC > 0) {
        $testi_text .= substr($testi_RSMSC[$im]['comment'], 0, ($char_RSMSC-3)).'...';
    } else {
        $testi_text .= $testi_RSMSC[$im]['comment'];
    }
    ####
    $RStesti_pic_file = '';
    if($imgDispRSMSC == '1') {
        if(file_exists(JPATH_ROOT.DS.'images'.DS.'com_rsmonials'.DS.$testi_RSMSC[$im]['id'].'.gif')) {
            $RStesti_pic_file = '<img src="'.JURI::root().'images/com_rsmonials/'.$testi_RSMSC[$im]['id'].'.gif" style="max-width:'.$imgMwRSMSC.'px; max-height:'.$imgMhRSMSC.'px; border:'.$imgBorderRSMSC.';" />';
        } else if(file_exists(JPATH_ROOT.DS.'images'.DS.'com_rsmonials'.DS.$testi_RSMSC[$im]['id'].'.png')) {
            $RStesti_pic_file = '<img src="'.JURI::root().'images/com_rsmonials/'.$testi_RSMSC[$im]['id'].'.png" style="max-width:'.$imgMwRSMSC.'px; max-height:'.$imgMhRSMSC.'px; border:'.$imgBorderRSMSC.';" />';
        } else if(file_exists(JPATH_ROOT.DS.'images'.DS.'com_rsmonials'.DS.$testi_RSMSC[$im]['id'].'.jpg')) {
            $RStesti_pic_file = '<img src="'.JURI::root().'images/com_rsmonials/'.$testi_RSMSC[$im]['id'].'.jpg" style="max-width:'.$imgMwRSMSC.'px; max-height:'.$imgMhRSMSC.'px; border:'.$imgBorderRSMSC.';" />';
        } else if(file_exists(JPATH_ROOT.DS.'images'.DS.'com_rsmonials'.DS.$testi_RSMSC[$im]['id'].'.jpeg')) {
            $RStesti_pic_file = '<img src="'.JURI::root().'images/com_rsmonials/'.$testi_RSMSC[$im]['id'].'.jpeg" style="max-width:'.$imgMwRSMSC.'px; max-height:'.$imgMhRSMSC.'px; border:'.$imgBorderRSMSC.';" />';
        } else {
            $RStesti_pic_file = $RS_noimg;
        }
        if($imgAlignRSMSC == '1') {
            $RStesti_pic_file = '<div style="margin-bottom:5px; text-align:left;">'.$RStesti_pic_file.'</div>';
        } else if($imgAlignRSMSC == '2') {
            $RStesti_pic_file = '<div style="margin-bottom:5px; text-align:right;">'.$RStesti_pic_file.'</div>';
        } else if($imgAlignRSMSC == '3') {
            $RStesti_pic_file = '<span style="float:left; margin-right:5px;">'.$RStesti_pic_file.'</span>';
        } else if($imgAlignRSMSC == '4') {
            $RStesti_pic_file = '<span style="float:right; margin-left:5px;">'.$RStesti_pic_file.'</span>';
        } else {
            $RStesti_pic_file = '<div style="margin-bottom:5px; text-align:center;">'.$RStesti_pic_file.'</div>';
        }
    }
    ####
    $RSMSC_disp_context = '<div style="text-align:'.$alignRSMSC.';">'.$RStesti_pic_file.addslashes($testi_text).'</div><br /><em><strong>'.addslashes($testi_RSMSC[$im]['fname']).' '.addslashes($testi_RSMSC[$im]['lname']).'</strong>';
    if($displayaboutRSMSC == '1') {
        if(($testi_RSMSC[$im]['about'] != '') || ($testi_RSMSC[$im]['location'] != '')) {
            $RSMSC_disp_context .= ', Ηλικία: <small>';
            $RS_isa = 0;
            if($testi_RSMSC[$im]['about'] != '') {
                $RSMSC_disp_context .= addslashes($testi_RSMSC[$im]['about']);
                $RS_isa = 1;
            }
            if($testi_RSMSC[$im]['location'] != '') {
                if($RS_isa == '1') {
                    $RSMSC_disp_context .= ', ';
                }
                $RSMSC_disp_context .= addslashes($testi_RSMSC[$im]['location']);
            }
            $RSMSC_disp_context .= '</small>';
        }
    }
    if(($displayurlRSMSC == '1') && ($testi_RSMSC[$im]['website'] != '')) {
        $RSMSC_disp_context .= '<br /><small>'.$testi_RSMSC[$im]['website'].'</small>';
    }
    if($displaydateRSMSC == '1') {
        $RSMSC_disp_context .= '<br /><small>'.$dateView_RSMSC.'</small>';
    }
    $RSMSC_disp_context .= '</em>';

?>
pausecontent[cnti++]='<?php echo $RSMSC_disp_context; ?>';
<?php
}
?>

function pausescroller(content, divId, divClass, delay){
this.content=content //message array content
this.tickerid=divId //ID of ticker div to display information
this.delay=delay //Delay between msg change, in miliseconds.
this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over scroller (and pause it if it is)
this.hiddendivpointer=1 //index of message array for hidden div
document.getElementById(divId).innerHTML = '<div class="innerDiv" style="position: absolute; width: 100%" id="' + divId + '1">' + content[0] + '</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="' + divId + '2">' + content[1] + '</div>';
//document.write('<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>')
var scrollerinstance=this
if (window.addEventListener) //run onload in DOM2 browsers
window.addEventListener("load", function(){scrollerinstance.initialize()}, false)
else if (window.attachEvent) //run onload in IE5.5+
window.attachEvent("onload", function(){scrollerinstance.initialize()})
else if (document.getElementById) //if legacy DOM browsers, just start scroller after 0.5 sec
setTimeout(function(){scrollerinstance.initialize()}, 500)
}

/* initialize()- Initialize scroller method. -Get div objects, set initial positions, start up down animation */

pausescroller.prototype.initialize=function(){
this.tickerdiv=document.getElementById(this.tickerid)
this.visiblediv=document.getElementById(this.tickerid+"1")
this.hiddendiv=document.getElementById(this.tickerid+"2")
this.visibledivtop=parseInt(pausescroller.getCSSpadding(this.tickerdiv))
//set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2)
this.visiblediv.style.width=this.hiddendiv.style.width=this.tickerdiv.offsetWidth-(this.visibledivtop*2)+"px"
this.getinline(this.visiblediv, this.hiddendiv)
this.hiddendiv.style.visibility="visible"
var scrollerinstance=this
document.getElementById(this.tickerid).onmouseover=function(){scrollerinstance.mouseoverBol=1}
document.getElementById(this.tickerid).onmouseout=function(){scrollerinstance.mouseoverBol=0}
if (window.attachEvent) //Clean up loose references in IE
window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null})
setTimeout(function(){scrollerinstance.animateup()}, this.delay) 
}


/* animateup()- Move the two inner divs of the scroller up and in sync */

pausescroller.prototype.animateup=function(){
var scrollerinstance=this
if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){
this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px"
this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px"
setTimeout(function(){scrollerinstance.animateup()}, 50)
}
else{
this.getinline(this.hiddendiv, this.visiblediv)
this.swapdivs()
setTimeout(function(){scrollerinstance.setmessage()}, this.delay)
}
}

/* swapdivs()- Swap between which is the visible and which is the hidden div */

pausescroller.prototype.swapdivs=function(){
var tempcontainer=this.visiblediv
this.visiblediv=this.hiddendiv
this.hiddendiv=tempcontainer
}

pausescroller.prototype.getinline=function(div1, div2){
div1.style.top=this.visibledivtop+"px"
div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px"
}

/* setmessage()- Populate the hidden div with the next message before it's visible */

pausescroller.prototype.setmessage=function(){
var scrollerinstance=this
if (this.mouseoverBol==1) //if mouse is currently over scoller, do nothing (pause it)
setTimeout(function(){scrollerinstance.setmessage()}, 100)
else{
var i=this.hiddendivpointer
var ceiling=this.content.length
this.hiddendivpointer=(i+1>ceiling-1)? 0 : i+1
this.hiddendiv.innerHTML=this.content[this.hiddendivpointer]
this.animateup()
}
}

pausescroller.getCSSpadding=function(tickerobj){ //get CSS padding value, if any
if (tickerobj.currentStyle)
return tickerobj.currentStyle["paddingTop"]
else if (window.getComputedStyle) //if DOM2
return window.getComputedStyle(tickerobj, "").getPropertyValue("padding-top")
else
return 0
}

//new pausescroller(name_of_message_array, CSS_ID, CSS_classname, pause_in_miliseconds)
new pausescroller(pausecontent, "rsmsc_scroller", "rsmsc_scroller_class", <?php echo $delay_RSMSC; ?>);
//-->
</script>

您设置innerHTML的值需要是一个完整的字符串-将“添加”到每一侧将修复它：

document.getElementById('divId').innerHTML = '"<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>";'

更改此行：

document.getElementById('divId').innerHTML = "<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>";

---

欢迎加入。请选择a以了解SO的工作原理。此外，您可以通过阅读了解如何解释问题，并有更好的机会获得答案。感谢您的快速回复！但在每一面加上“不”并不能解决问题。内容未显示在前端。我不确定是否只是将下面注释的document.write函数替换为document.getElementById就足够了。。。。谢谢你，这是我第一次尝试。。。但那没用。我应该发布整个php代码以便您更好地理解吗？有没有可能我需要在别处换点别的东西？再次感谢。。因为我不知道把建议的代码放在哪里，我可以发布整个php文件吗？因为我不熟悉编程，我尝试在这里发布整个php代码，我不知道这是否是我尝试的方式，但我不能说太长。在哪里可以执行此操作？很抱歉，我在上一条注释中意外地按了enter键，请查找调用pausescroller函数的行，即它最初使用document.write放置元素的位置，如果需要，请将父div放在该行之前。因此，如果它在php文件echo中；很抱歉因为不了解。。。我发布了整个JavaScript部分。你能检查一下吗？谢谢

document.getElementById(divId).innerHTML = '<div class="innerDiv" style="position: absolute; width: 100%" id="' + divId + '1">' + content[0] + '</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="' + divId + '2">' + content[1] + '</div>';

pausescroller(content, divId, divClass, delay);