Javascript HTML网格视图和列表视图
因此，我希望我的内容根据我单击的按钮（网格视图和列表视图）更改其外观。。 我做了一些研究，大部分工作都可以使用jquery完成。但我只想使用javascript。 我的问题是： 我应该使用什么元素？我目前正在使用语义用户界面设计我的应用程序（如果这是一个真实的词的话） 我在stackoverflow中找到了这个片段 但我似乎不能让它运行，我的意思是它运行，但它不会改变外观取决于按钮点击如果我把html，我必须添加一些更多的东西吗？它在小提琴上工作，但在本地浏览器上运行时不起作用。谢谢Javascript HTML网格视图和列表视图,javascript,html,listview,gridview,Javascript,Html,Listview,Gridview,因此，我希望我的内容根据我单击的按钮（网格视图和列表视图）更改其外观。。 我做了一些研究，大部分工作都可以使用jquery完成。但我只想使用javascript。 我的问题是： 我应该使用什么元素？我目前正在使用语义用户界面设计我的应用程序（如果这是一个真实的词的话） 我在stackoverflow中找到了这个片段 但我似乎不能让它运行，我的意思是它运行，但它不会改变外观取决于按钮点击如果我把html，我必须添加一些更多的东西吗？它在小提琴上工作，但在本地浏览器上运行时不起作用。谢谢 $('bu
$('button').click(function(e) {
if ($(this).hasClass('grid')) {
$('#container ul').removeClass('list').addClass('grid');
}
else if($(this).hasClass('list')) {
$('#container ul').removeClass('grid').addClass('list');
}
});
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$( document ).ready(function() {
$('button').click(function(e) {
if ($(this).hasClass('grid')) {
$('#container ul').removeClass('list').addClass('grid');
}
else if($(this).hasClass('list')) {
$('#container ul').removeClass('grid').addClass('list');
}
});
});
</script>
$（文档）.ready（函数（）{
$（“按钮”）。单击（函数（e）{
if（$（this）.hasClass（'grid'））{
$（'#container ul'）.removeClass（'list'）.addClass（'grid'）；
}
else if（$（this）.hasClass（'list'））{
$（'#container ul'）.removeClass（'grid'）.addClass（'list'）；
}
});
});