通过JS修改html标签属性

html-css091

通过JS修改html标签属性,第1张

<pre>

<code class="language-bash">

xxxx

</code>

</pre>

<script>

window.onload=function(){

   var codes=document.getElementsByTagName("code")

   for(var i in codes){

      if(codes[i].className&&codes[i].className.indexOf("language-bash")>-1){

         codes[i].parentNode.className="command-line language-bash"

         codes[i].parentNode.dataset.user="root"

         codes[i].parentNode.dataset.host="localhost"

      }

   }

}

</script>

原型是用DOM的style属性方法:

Element.style.[styleDOMName] = "value"

Element:指定元素,用document.createElement / document.getElement获取元素obj

或者使用setAttribute方法:

Element.setAttribute('style','css代码')//会覆盖所有的原来在这个标签上style属性赋的值

Element.setAttribute('style',Element.getAttribute('style') + "")//不会覆盖