今天写网络前端训练营的时候,要求动态显示界面中卡片(各种组合起来的标签)的个数,于是百度学习了下。

js有两种创建方法,第一种是在innerHTML中直接写,第二种是创建标签然后插入到网页中。

第一种:

var div_1 = document.createElement('div');
div_1 .innerHTML+="<a class=\"a_1\">我是一个A标签</a>";

这种方法书写困难,还要给双引号写转义符,各种麻烦。所以我肯定不会用这种。

第二种:

var div_1 = document.createElement('div');

这就创建好了,显示的话需要插入父容器(标签)内。

paent.appendChild(div_1);

这就添加到父容器(标签)内尾部位置。创建添加完毕。

 

div_1.setAttribute('class', className);

PS:setAttribute()是一个设置属性的方法,这里设置是claas 的名字 id、value、href等标签内的属性都可以设置。

append(),父级最后追加一个子元素

appendTo(),将子元素追加到父级的最后

appendChild(),在节点的最后追加子元素

prepend(),在父级最前面追加一个子元素

prependTo(),将子元素追加到父级的最前面

after(),在当前元素之后追加(是同级关系)

before(),在当前元素之前追加(是同级关系)

insertAfter(),将元素追加到指定对象的后面(是同级关系)

 

$('.name').append()可以使用

其他没试验过。