完成更改并在网页中添加内容

-7

我试图创建一个网页，当点击激活时，完全改变div元素的内容。我目前在div中嵌入了一些文本和一个视频，并且当点击div按钮时，我想删除它并添加新内容，例如链接，更多视频等。我还没有找到关于这个问题的很多有用的信息。任何帮助是极大的赞赏。 Here is a link to a fiddle:完成更改并在网页中添加内容

<div id="content"> 
<p>"Text, text, more text."</p> 
<h1>"Text"</h1> 
<img src="#"></img> 
</div>

来源

2013-05-01 user2339815

这将是有益的，如果你可以张贴一些代码，或者至少是一个jsFiddle的链接。 – oomlaut 2013-05-01 15:06:50

很难相信你找不到任何信息。这是你可以做的最基本的事情之一，几乎在每个教程中都有介绍。 – JJJ 2013-05-01 15:10:36

假设你有这样的事情：

<div id="somecontent"><video ...><p>Video Caption</p></div>

您可以使用简单的DOM scripting选择元素并替换其内容：

<script> 
    var element = document.getElementById("somecontent"); 
    element.innerHTML = "<audio><p>New Caption</p>" 
</script>

你会再配合这个替换到的onclick事件输入或链接样式看起来像一个按钮。

希望这会有所帮助。

来源

2013-05-01 15:12:01 oomlaut

非常感谢你oomlaut！如果我将该代码编入函数，对我有帮助吗？ – user2339815 2013-05-01 15:23:01

不一定，除非您需要重复其他元素之间共享的功能。您可以简单地将替换分配为元素的onclick事件的操作。检查出来[这里]（http://jsfiddle.net/mMWvS/） – oomlaut 2013-05-01 15:38:32

非常感谢！ – user2339815 2013-05-01 18:23:56

jQuery可以帮助你很多这样的东西。例如，试试jQuery的click和html方法。然后，你可以做这样的事情：

$('.my_button').click(function() { 

    // this function gets executed when an element 
    // with the classname '.my_button' gets clicked 

    $('.my_div').html(
     'this contents get inserted in ' + 
     'the element with classname ".my_div".' 
    ); 

}

安装jQuery是为包括jQuery代码调用自己的JavaScript代码之前一样简单！获取源over here。

来源

2013-05-01 15:11:38 rednaw

+1 - 比使用输入的onclick事件要好得多。不知道为什么它被downvoted – cowls 2013-05-01 15:15:56

也许这是因为OP没有问使用jQuery作为解决方案。不确定。 – oomlaut 2013-05-01 17:02:03

完成更改并在网页中添加内容

回答

相关问题