Ici je

    var prop= document.querySelectorAll('[data-name="header"]')[0].getAttribute("class");
    var class_name= "."  + prop ;
class_name {
    display: none;
}   
<div class="_69x2sms" data-name="header">
  <div class="_18tvv4h">
    <a target="_blank" href="">
        <span>Done
            <span class="_qx8n3fw">..!</span>
        </span>
    </a>
    </div>
  <div class="_8sfqbvd">have fun</div>
</div>

J'essaye d'obtenir la variable JavaScript c'est-à-dire "nom_classe" à l'intérieur de la balise de style le code va ici et class = "_ 69x2sms" est dynamique ici

<div class="_69x2sms" data-name="header">
  <div class="_18tvv4h">
    <a target="_blank" href="">
        <span>Done
            <span class="_qx8n3fw">..!</span>
        </span>
    </a>
    </div>
  <div class="_8sfqbvd">have fun</div>
</div>

<script type="text/javascript">
    var prop= document.querySelectorAll('[data-name="header"]')[0].getAttribute("class");
    var class_name= "."  + prop ;
</script>

<style>

class_name {
    display: none;
}   
</style> 
-1
user13164358 5 avril 2020 à 16:26

3 réponses

Meilleure réponse
let class_name = document.querySelector('[data-name="header"]').getAttribute("class");  //this will get the class of attr data-name


document.querySelector('.' + class_name).style.display = 'none'; //this will set it's display to none;

//You can directly also do so ↓↓--

//document.querySelector('[data-name="header"]').style.display = 'none';
<div class="_69x2sms" data-name="header">
  <div class="_18tvv4h"><a target="_blank" href=""><span>Done<span class="_qx8n3fw">..!</span></span></a></div>
  <div class="_8sfqbvd">have fun</div>
</div>
0
sauhardnc 5 avril 2020 à 13:43

Il semble que votre solution au problème ne soit probablement pas la meilleure solution. Si vous souhaitez modifier des éléments dynamiques avec css, vous pouvez créer une classe statique pour eux:

.custom_class {
    display: none;
}

Puis ajoutez la classe à certains éléments avec element.classList.add("custom_class"); au lieu d'essayer de modifier les classes existantes.

0
Ollie 5 avril 2020 à 13:40

Vous ne pouvez pas ajouter quelque chose dans le tag "STYLE" déjà construit mais vous pouvez en créer un comme ceci:

var css = class_name +'{ display: none }',
head = document.head || document.getElementsByTagName('head')[0],
style = document.createElement('style');

head.appendChild(style);

style.type = 'text/css';
if (style.styleSheet){
  // This is required for IE8 and below.
  style.styleSheet.cssText = css;
} else {
  style.appendChild(document.createTextNode(css));
}
0
noshad b.e 5 avril 2020 à 13:39