Question

我想将以下函数插入head

<script='javascript'>                           
                function inputSpoiler(input-title,input-text)
                {
                    <div style="margin: 5px 20px 20px;">
                    <div class="smallfont" style="margin-bottom: 2px;">
                    <b>input-title</b>: <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" style="font-size: 12px; margin: 0px; padding: 0px; width: 55px;" type="button" value="Buka" /> </div>
                    <div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
                    <div style="display: none;">
                    input-text
                    <img border="0" /></div>
                    </div>
                    </div>              
                }

    </script>

这些功能会在我的博文中产生一个'剧透者'。我想在body中调用这些函数，如

<script>
document.getElementById("output-spoiler").innerHTML =inputSpoiler('i-input-some-title','i-input-some-text');
</script>

然后它显示

我想要的只是input-title和Buka按钮。

如何使这项工作？

更新

这是我目前的整页代码

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
    <script='javascript'>                           
                function inputSpoiler(input-title,input-text)
                {
                    <div style="margin: 5px 20px 20px;">
                    <div class="smallfont" style="margin-bottom: 2px;">
                    <b>input-title</b>: <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" style="font-size: 12px; margin: 0px; padding: 0px; width: 55px;" type="button" value="Buka" /> </div>
                    <div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
                    <div style="display: none;">
                    input-text
                    <img border="0" /></div>
                    </div>
                    </div>              
                }

    </script>
</head>

<body>
The content of the document......
<div id='output-spoiler'>
</spoiler>
<script>
document.getElementById("output-spoiler").innerHTML =inputSpoiler('i-input-some-title','i-input-some-text');
</script>
</body>
</html>

Answer 1

这是你想要的吗？

    <!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>

</head>

<body>
    <script >                           
                function inputSpoiler(inputTitle,inputText)
                {
                    var spText = '<div style="margin: 5px 20px 20px;">\n';
                    spText += '<div class="smallfont" style="margin-bottom: 2px;">\n';
                    spText += '<b>' + inputTitle +'</b>: <input onclick="if (this.parentNode.parentNode.getElementsByTagName(\'div\')[1].getElementsByTagName(\'div\')[0].style.display != \'\') { this.parentNode.parentNode.getElementsByTagName(\'div\')[1].getElementsByTagName(\'div\')[0].style.display = \'\'; this.innerText = \'\'; this.value = \'Tutup\'; } else { this.parentNode.parentNode.getElementsByTagName(\'div\')[1].getElementsByTagName(\'div\')[0].style.display = \'none\'; this.innerText = \'\'; this.value = \'Buka\'; }" style="font-size: 12px; margin: 0px; padding: 0px; width: 55px;" type="button" value="Buka" /> </div>\n';
                    spText += '<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">\n <div style="display: none;">\n' ;
                    spText += inputText;
                    spText += '<img border="0" /></div>\n </div>\n  </div> \n';

                    return spText;
                }

    </script>
The content of the document......
<div id='output-spoiler'>
</div>
<script>
document.getElementById("output-spoiler").innerHTML =inputSpoiler('i-input-some-title','i-input-some-text');
</script>
</body>
</html>

将JavaScript嵌入Head中，从Body调用

1 个答案: