如何动态创建轮播图的图标

关于动态创建轮播图所用的知识点是关于JS中节点的操作和JS中属性的操作。

关于JS中的效果图，首先我们需要考虑图片和轮播图图标怎么能结合在一起。

我们需要那些元素。在这里我呢，就简单介绍一下。

一、设置属性节点的样式。在父元素box后面添加一个div，现在style 中设置div的样式。

二、我所做的是插入6张图片，然后在图片上动态创建小圆点。

三、ＪＳ部分获取父元素。然后自父元素后面插入一个div元素。然后用元素节点能够利用的设置属性的方式，分别是

setAttribute getAttribute　removeAttribute("属性”，“值”） 他们不属于document对象所以只能由元素节点调用的函数。document对象操作的是整个dom树的元素有三种获取元素的方法分别是getElmenById getElementsByTagName 还有获取元素的class属性的方法。getElementByClassName.同时我们会想一下ＪＱｕｅｒｙ中获取元素的方式是什么，又是如何操作dom 元素的属性的呢？

　jquery提供大量的选择器供给我们使用，其中很大一部分是ＣＳＳ选择器的继承，使得我们更加方便的操作，html中的元素，jquery中的选择有基本选择器（通过ＩＤ　通过类获取元素使用的比较多）层次选择器（>子选择器　空格是后代选择器）过滤选择（：first  :last :even :eq(index)) 还有内容过滤选择器（:contains(text) :empty :parent)等等。除了这些最近很火的H5也有属于自己的API通过　document.querySelector document.querySelectorAll( )获取元素。我们要学会区分它们的差异和共性。

　上面说的是那么多，就是一点，我们网页执着离不开dom树中的元素，要让给他们设置我们的样式和功能，第一步是要获取他们。

三、我们这里设置加入了div 元素节点之后，给他设置.circle的样式。然后遍历lis，在没添加一个lis的情况下都会新增一个

div下的span子节点。通过innerHTML给节点传递内容。innerHTML是给双标签传递或者获取值，而.value是给input等单标签获取值。获取div下的 span元素然后给该元素第一个子节点添加样式current;