Javascript OuterHTML：如何使用字符串文字？

Question

首先是一些HTML代碼：

<div id="content_4" class="content" style="background:url(pic1.gif)"></div> 
<div id="content_4_a" class="content" style="background:url(pic2.gif); 
    display:none"></div> 

這是JS代碼：

function getOuterHMTL(element){ 
    return element.outerHTML; 
} 

function switchDisplayOuter(elementToHide, elementToShow, stringly){ 
    document.getElementsByName(elementToShow).outerHTML=stringly; 
    document.getElementById(elementToHide).style.display="none"; 
    document.getElementsByName(elementToShow)[0].style.display=""; 
} 

現在這個HTML代碼的工作（當我點擊它，在div開關和畫面改變）：

<area shape="rect" coords="0,252,98,337" onMouseOver="switchDisplayOuter(
    'content_4', 'content_4_a', getOuterHMTL('content_4_a))"> 

但不是這一個：

<area shape="rect" coords="0,252,98,337" onMouseOver="switchDisplayOuter(
    'content_4', 'content_4_a', '<div id="content_4_a" class="content" 
    style="background:url(pic2.gif); display:none"></div>')"> 

它只是讓我的錯誤代碼，同時調試在Firefox：

Error: SyntaxError: unterminated string literal 
'<div id= 

有人誰知道不使用功能getOuterHMTL（元素），但「普通」字符串文字正確的代碼？

Answer 1

您需要\'更換您的"的onMouseOver屬性值內：

<area shape="rect" coords="0,252,98,337" onMouseOver="switchDisplayOuter('content_4', 'content_4_a', '<div id=\'content_4_a\' class=\'content\' style=\'background:url(pic2.gif); display:none\'></div>')"> 

這是因爲你的area標籤的onMouseOver屬性的值括與"。