关于JavaScript insertAfter 和 getElementsByClassName

// insertAfter
function insertAfter(newElement, targetElement) {
  var parent = targetElement.parentNode
  if (parent.lastChild == targetElement) { // 检查目标元素是不是parent的最后一个子元素。
    // 如果是最后一个子元素,就用appendChild方法把新元素追加到parent元素上,这样新元素就恰好被插入到目标元素之后
    parent.appendChild(newElement)
  } else {
    // 如果不是,则插入在目标元素的下一个兄弟节点的前面。也就是目标元素的后面
    parent.insertBefore(newElement, targetElement.nextSibling)
  }
}

调用方法:
insertAfter(newElement, targetElement);
1.新元素:你想插入的元素(newElement)。
2.目标元素:你想把这个新元素插入到哪个元素(targetElement)之前。

// getElementsByClassName兼容问题
function getElementsByClassName(classname, node) {
  var aResult = [] // 定义一个空数组用来存储获取到指定classname元素
  if (node.getElementsByClassName) { // 是否支持getElementsByClassName
    return node.getElementsByClassName(classname) // 使用现有方法
  } else {
    var aEle = node.getElementsByTagName('*') // 获取页面所有元素
    for (var i = 0; i < aEle.length; i++) { // 遍历获得的元素
      var perEle = ' ' + aEle[i].className + ' ' // 加上' '只是为了给原class属性值左右加上一个空格符
      if (perEle.indexOf(' ' + classname + ' ') != -1) { 
        // 这里加上' '是为了让寻找的class是一个单独的class,避免出现找div1,却出现div12的现象。
        aResult.push(aEle[i])
      }
    }
    return aResult // 注意return语句写在for循环外
  }
}

你可能感兴趣的:(关于JavaScript insertAfter 和 getElementsByClassName)