Maison  >  Article  >  interface Web  >  Comment obtenir un changement de couleur entrelacé à l'aide de js

Comment obtenir un changement de couleur entrelacé à l'aide de js

亚连
亚连original
2018-06-23 15:48:172097parcourir

Cet article présente principalement à tout le monde l'effet de changement de couleur entrelacé de pure js. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer

L'exemple dans cet article partage avec vous le changement de couleur entrelacé. effet de js. Le code spécifique est pour votre référence. Le contenu spécifique est le suivant

<script type="text/javascript">
 function createTable(){
  //创建表格
  var table = document.createElement("table");
  
  //设置表格的行数
  for(var i=0;i<4;i++){
   var tr = document.createElement("tr");
   //设置表格的列数
   for( var j=0;j<5;j++){
    var td = document.createElement("td");
    tr.appendChild(td);
    //添加文本
    var txt = document.createTextNode("wkk");
    td.appendChild(txt);
   }
   
   //判断颜色的变换
   if(i%2==0){
    //添加属性(第一种)
    tr.style.backgroundColor = "#f0f";
   } else {
    tr.style.backgroundColor = "#ff0";
   }
   
   table.appendChild(tr);
  }
  
  //添加属性(第二种)
  table.setAttribute("border","1px");
  //table.style.border = "solid 1px red";
  table.setAttribute("width","200px");
  table.setAttribute("height","100px");
  
  
  //添加到body中
  document.body.appendChild(table);
  
  
 }//create table over
 
 createTable();
</script>

Ce qui précède est ce que j'ai compilé pour vous, j'espère qu'il vous sera utile à l'avenir.

Articles connexes :

Quels sont les types de données spéciaux en JavaScript ?

Comment utiliser le réseau de requêtes pour effectuer des opérations de requête dans Mini-programmes WeChat

Utiliser NodeJS pour écrire des exemples de robots

Quels problèmes rencontrez-vous lorsque vous utilisez MathJax dans Angular ?

Comment utiliser l'architecture Redux dans ReactNative

Comment implémenter la conversion explicite et la conversion implicite en javascript

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn