如何计算动态添加元素的类名

时间:2016-06-17 07:06:52

标签: javascript

在尝试计算动态添加元素的ClassNames时,是否应该记住一些内容?

有关以下说明,请参阅链接。点击"(+)课程"任何学期的按钮(动态添加),课程将附加到相应的学期,并带有自己的按钮。这有效。然而,就像我在学期一样,我有一个限制,每个元素可以有多少(即总共5学期,每学期7个课程),但我似乎无法计算我的数量课程。

每个学期的课程都有一个唯一的ClassName,它是学期ID和单词" Course"的结合,产生类似" sem#4Course&#34的内容;。这段代码片段是我汇编和计算每门课程的ClassNames的方式。它有什么问题吗?我已将其余代码附加到链接中。

var parentId = $(this).parent().attr('id');
var crsClass = parentId+"Course";
var crsCount = $('.'+crsClass).length;

https://jsfiddle.net/4efzf681/2/

我上周才开始学习JavaScript / JQuery,所以请耐心等待。我很抱歉没有在HTML,CSS和JavaScript之间分离我的代码。我在一个文件中工作并在完成后将其分开,而且我之前从未使用过小提琴。我感谢任何帮助。

3 个答案:

答案 0 :(得分:0)

通过在课程类名称中添加父id属性,您会混淆jQuery的选择器引擎。这些类将包含#,猜测jquery认为你想要选择一个元素id

通过

改变了这一点

var crsClass = parentId.replace("#", "")+"Course";

我修理了你的小提琴。确保下次将你的js放在底部窗口;)。 我还将crsCount变量移动到底部,以便在将课程附加到DOM之后分配值。

YOUR FIDDLE

答案 1 :(得分:0)

您的班级名称#sem#1中的sem#1Course字符会为查看$()查询选择器带来问题.sem id #1#1Course。最好不要在类名和ID中使用#.个字符。而是使用连字符和下划线字符。

改进的小提琴在这里:https://jsfiddle.net/6pdfjbt1/

答案 2 :(得分:0)

您可以使用javascript方法[{1}}

elements获取class name
getElementsByClassName