使用javascript从html中删除div

这是我的代码。它在一个php文件中。它不完全符合我的要求。它隐藏了一个选项并显示另一个选项，但是我需要做的不仅仅是可视化隐藏的选项，而且根本不显示在html中。现在，如果你点击查看源代码，它会显示所有的div。我需要它时，我点击一个选项，其他人从HTML和查看页面源消失，只是选择在那里。有关于此的任何想法？使用javascript从html中删除div

<select name="type" onchange="showstuff(this.value);"> 
       <option value="code">Code</option> 
       <option value="look">Look</option> 
       <option value="have" selected>Have</option> 
    </select> 

    <div id="have" style="display:block;">1</div> 
<div id="look" style="display:none;">2</div> 
    <div id="code" style="display:none;">3</div> 

    <script> 
    function showstuff(element){ 
     document.getElementById("have").style.display = element=="have"?"block":"none"; 
     document.getElementById("look").style.display = element=="look"?"block":"none"; 
      document.getElementById("code").style.display = element=="code"?"block":"none"; 
    } 
    </script>

来源

2016-12-06 the.matrix

“查看源文件”永远不会改变。如果您修改DOM，浏览器中的DOM检查器将会更改，但源代码是您的浏览器最初收到的内容，并且不会更改。 – lonesomeday

所以有没有办法使用JavaScript来显示/加载HTML只是我需要的div？ –

有一种方法可以做@lonesomeday .....坚持我会为你写 – driconmax

您可以创建一个div来将激活选项放在上面。

像这样的事情

<select name="type" onchange="showstuff(this.value);"> 
    <option value="code">Code</option> 
    <option value="look">Look</option> 
    <option value="have" selected>Have</option> 
</select> 

<div id="optionContainer"> 
</div> 

<script> 

    //Object with the options. you can access for example have with options['have'] or options.have 
    var options = {'have':'<div id="have"><b>1</b></div>', 
        'look':'<div id="have"><b>2</b></div>', 
        'code':'<div id="have"><b>3</b></div>'}; 

    function showstuff(element){ 
     //Replace the inner HTML of the div optionContainer with the string in the option 
     document.getElementById("optionContainer").innerHTML = options[element]; 
    } 

</script>

我创造了这个jsfiddle看到它在行动

来源

2016-12-06 12:35:17 driconmax

谢谢。事情是在

之间，我没有文字，但更多潜水的不同选项1 2 3.关于这个的任何想法？ –

只需在对象中添加div。 ' '有'： '

'' – driconmax

例如：

–

使用jQuery方法 - 秀（），hide（）和删除（）。可以使用$（“＃id”）。remove（）从呈现的页面中移除html。

https://api.jquery.com/remove/

来源

2016-12-06 12:48:19

这将从DOM中删除它，而不是从页面源 – phobia82

谢谢你的评论，我投了你的答案。我希望我可以将两个答案都标记为已接受。 –

使用javascript从html中删除div

回答

相关问题