test 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
  1. console.log('salut');
  2. // fusion cellules dans tableau
  3. ///
  4. // doit chercher un p dans td dans tbody dans table dans .paragraph--type--text qui a la class .rowspan et setAttribut a son parent td
  5. var cellRowspan = document.querySelector('p.rowspan').parentElement;
  6. console.log(cellRowspan);
  7. cellRowspan.setAttribute('rowspan', '4');
  8. // // ok va chercher tous les éléments p.cell-display-none (child)
  9. // const pDisplayNone = document.querySelectorAll('p.cell-display-none');
  10. // console.log(pDisplayNone);
  11. // // ok va chercher un element td (parent)
  12. // var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;
  13. // console.log(tdDisplayNone);
  14. // /// et lui appliquer une class.
  15. // tdDisplayNone.classList.add('display-none');
  16. ///// comment aller chercher TOUS les éléments td ? //////
  17. // const pDisplayNone = document.querySelector('p.cell-display-none');
  18. // console.log(pDisplayNone.closest('.field__item'));
  19. // let td = pDisplayNone.parentNode;
  20. // const tdparent = pDisplayNone.closest('td');
  21. // // while(pDisplayNone.parentNode){
  22. // // tdparent.push(td);
  23. // // pDisplayNone = pDisplayNone.parentNode;
  24. // // }
  25. // console.log(tdparent);
  26. /// pour chaque élément de array pDisplayNone ( NodeList ),
  27. // pDisplayNone.forEach((element) =>document.querySelectorAll('td'));
  28. /// aller chercher le parent td
  29. /// et lui appliquer une class.
  30. // faut faire un array de td avant de faire un for each
  31. // let td = new Array(pDisplayNone);
  32. // console.log(td);
  33. // const child = document.getElementById('child');
  34. // const parentWithClass = child.closest('.parent');
  35. // console.log(parentWithClass); // 👉️ div.parent
  36. // const parent = document.getElementById("parent");
  37. // let childNodes = parent.childNodes;
  38. // console.log(childNodes.length); // let's assume "2"
  39. // parent.appendChild(document.createElement("div"));
  40. // console.log(childNodes.length); // outputs "3"
  41. // function displayNone(){
  42. // for (let i = 0; i < cellsDisplayNone.lenght; i++ ){
  43. // const cellDisplayNone = cellsDisplayNone.parentElement[i]
  44. // // let cellDisplayNone = this.parentElement.getElementsByClassName("cell-display-none");
  45. // // console.log(cellDisplayNone);
  46. // }
  47. // };
  48. // cellDisplayNone.classList.add('display-none');
  49. // cellDisplayNone.style.display ="none";
  50. // for (let i = 0; i < cellDisplayNone.lenght; i++ ){
  51. // cellDisplayNone.style.display ="none";
  52. // }
  53. //////////////
  54. // var cellsRowspan = document.getElementsByClassName("rowspan");
  55. // var cellsDisplayNone = document.getElementsByClassName("cell-display-none");
  56. // function rowspan(){
  57. // // for (let i = 0; i < cellsRowspan.length; i++){
  58. // // cellsRowspan[i].
  59. // // }
  60. // let cellRowspan = this.parentNode.querySelector(".rowspan");
  61. // cellRowspan.setAttribute('rowspan', '4');
  62. // }
  63. // function tableOne(){
  64. // var table1cell1 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
  65. // var table1cell2 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
  66. // var table1cell3 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
  67. // var table1cell4 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
  68. // table1cell1.setAttribute('rowspan', '4');
  69. // table1cell2.style.display ="none";
  70. // table1cell3.style.display ="none";
  71. // table1cell4.style.display ="none";
  72. // }
  73. // // function tableTwo(){
  74. // // var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
  75. // // var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
  76. // // var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
  77. // // var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
  78. // // table2cell1.setAttribute('rowspan', '4');
  79. // // table2cell2.style.display ="none";
  80. // // table2cell3.style.display ="none";
  81. // // table2cell4.style.display ="none";
  82. // // }
  83. // tableOne();
  84. // tableTwo();
  85. // var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
  86. // var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
  87. // var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
  88. // var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
  89. // table2cell1.setAttribute('rowspan', '4');
  90. // table2cell2.style.display ="none";
  91. // table2cell3.style.display ="none";
  92. // table2cell4.style.display ="none";
  93. // const table = document.getElementByClass("paragraph--type--text");
  94. // console.log(hello);
  95. // for (const child of table.children) {
  96. // console.log(child.tagName);
  97. // }
  98. // const paragraph = document.getElementsByClassName("paragraph--type--text");
  99. // for (const table of paragraph.children){
  100. // table.addClass("rowspan");
  101. // }