Javascript 单击复选框并显示“；新闻"；仅适用于该类型的类别

所以我制作了从网站上阅读新闻的代码，然后它显示在我的网站上。下面是发生的情况：

我读取类别并将它们放在一个数组中，我检查它是否已经存在于数组中，如果不存在，那么我添加类别。按数组

我需要的是单击复选框（可以单击/选择多个复选框），刷新页面并显示仅选中类别的新闻

例如：

1
Category: A
Text

2
Category: B
Text

3
Category: B
Text

4
Category: C
Text

如果单击“B”复选框，则只会显示#2和#3。如果同时单击“B”和“C”复选框，#2、#3和#4

（正如您可能注意到的，我已经尝试获取ElementById并再次创建，但没有成功，因此我删除了showNews函数）

你知道怎么做吗？我的实际代码：

var noticeiastodas；
var pagActual=0；
var numNoticiaPag=5；
注意变异；
变量分类；
var arrayC=[]；
var计数=0；
$（文档）.ready（函数（）{
$.getJSON（“http://193.137.65.112/tpsi/noticias.php，功能（护墙板）{
NotifiasTodas=护墙板；
分类=[]；
setCategoria（）；
escreveNoticias（）；
});
});
//----作品
函数setCategoria（）{
noticiasActuais=noticiasTodas；
}
函数showNews（）{
var p#u body=$（“通知IASDIV”）；
p_body.empty（）；
对于（var i=0；i”+NotifiasActuais.artigo+”
“+NotifiasActuais.data+”
”；
p_body.append（林哈）；
}
});
}
}
//----作品
函数escrevenitias（）{
var p#u body=$（“通知IASDIV”）；
p_body.empty（）；
var c#u body=$（“#checkboxDiv”）；
c_body.empty（）；
$.each（noticeIAsActuais，函数）（索引，noticeIAsActuais）{
var linha=“”+NotifiasActuais.titulo+“+NotifiasActuais.categoria+”+NotifiasActuais.subtitulo+“
”+NotifiasActuais.artigo+”
“+NotifiasActuais.data+”
”；
p_body.append（林哈）；
var测试=arrayC.indexOf（NotifiasActuais.categoria）；
如果（测试==-1）{
arrayC.push（notifiasactuais.categoria）；
var check=“”+通知实际情况。分类+”；
c_body.追加（检查）；
}
});
var elemento=document.getElementById（“checkboxDiv”）；
elemento.addEventListener（“单击”，showNews）；
}

h2{
字体大小：15px；
颜色：橙色；
字体大小：粗体；
}
.类别{
字体大小：12px；
颜色：珊瑚；
}
h4{
字体大小：13px；
颜色：浅灰色；
字体大小：粗体；
字体：斜体；
填充：8px；
}
.段{
字号：12.5px；
颜色：浅灰色；
文本对齐：对齐；
文本对齐：词间对齐；
背景色：gainsboro；
填充：12px；
边界：1px；
边界半径：3px；
}
.第段：悬停{
背景色：白烟；
}
.日期{
字体大小：12px；
颜色：深灰色；
字体：斜体；
}
.检查{
}
.checkName{
右边距：20px；
左边距：5px；
颜色：珊瑚；
字体大小：正常；
}
.checkCont{
显示：块；
文本对齐：居中；
}

引导程序3，来自Layoutt！
诺西亚斯20-03-2015

我想你需要稍微改变一下逻辑

1） 包含类的容器中的每个新闻包装都等于新闻类别

2） 在复选框“更改简单切换”上显示所需的类别

请尝试查看代码段

var noticeiastodas；
var pagActual=0；
var numNoticiaPag=5；
注意变异；
变量分类；
var arrayC=[]；
var计数=0；
$（文档）.ready（函数（）{
$.getJSON（“http://193.137.65.112/tpsi/noticias.php，功能（护墙板）{
NotifiasTodas=护墙板；
分类=[]；
setCategoria（）；
escreveNoticias（）；
});
});
//----作品
函数setCategoria（）{
noticiasActuais=noticiasTodas；
}
函数showNews（）{
$（'..+this.value）.toggle（this.checked）；//切换所需类别
}
//----作品
函数escrevenitias（）{
//生成复选框
var类别=通知实际值减少（功能（acc、el）{
如果（！acc.map[el.categoria]）{
acc.map[el.CATEGRIA]=真；
acc.result.push（$（''）.attr（{type:“checkbox”，class:“check”，id:“cb”+el.categia，value:el.categia，checked:“checked”}））；
acc.result.push（$（''）.attr（{type:“checkbox”，class:“checkName”，表示“cb”+el.categoria}）.html（el.categoria））；
}
返回acc；
}，{map:{}，result:[]}）；
//产生新闻
var news=notifiasactuais.map（函数（el）{
返回$（''）.addClass（el.categoria）
.append（$（''）.html（el.titulo）
.append（$（''）.addClass（'类别'）
.html（el.categoria）））
.append（$（''）.html（el.subtitulo））
.append（$（“”）.addClass（“段落”）
.html（el.artigo））
.append（$（“”）.addClass（“日期”）
.html（el.data））；
});
//将新闻添加到主内容