La balise Buttons est cruciale pour que Jquery Attr fonctionne

Question

La fonction atrr ne donne pas la réponse requise, j'ai un petit code qui récupère les données d'une API externe qui a plusieurs données dans un dict.

<div id="facet-knowledge-panel" style="margin-left: 70px;">
        <h2 id="facet_panels_title"></h2>
        <div id="facet_panels_content"></div>
    </div>

    <button id="open">open</button>
 
    <script>
        let facet_kp = "http://localhost/render-to-html?facet_tag=category&value_tag=en:beers";

        fetch(facet_kp)
            .then((response) => {
                if (response.ok) {
                    return response.text();
                }
                else {
                    throw new Error("Network Response Error while fetching facet kp");

                }
            })
            .then(data => {
                let title = document.getElementById("facet_panels_title");
                title.innerHTML = "Facet knowledge panel";

                let knowledgepanel = document.getElementById("facet_panels_content");
                knowledgepanel.innerHTML = data;
            })
    </script>

Ici, id="facet_panels-content" renverra les données après les avoir obtenues de l'API, il contient les données dans la balise "<details><summery>...", mais je souhaite les conserver par défaut L'onglet Détails s'ouvre.

<script>
        $(document).ready(function(){
          $("#open").click(function(){
            $("#HungerGames").attr("open",true);
          });
        });
</script>

J'utilise le code Jquery pour ouvrir une seule étiquette de détail via un bouton et cela fonctionne bien, mais je veux qu'il s'ouvre par défaut sans aucun bouton.

$(document).ready(function(){
            $("#HungerGames").attr("open",true);
        });

Donc, si j'utilise ceci, cela n'ouvre pas l'onglet "Détails" pour cet identifiant. Je souhaite garder l'onglet "Détails" ouvert par défaut sans aucun bouton.

Answer 1

#HungerGames Le sélecteur ne correspond à aucun élément en HTML.

Donc, cette opération consiste probablement à l'ajouter à la page ? :

knowledgepanel.innerHTML = data;

Évidemment, vous ne pouvez pas interagir avec l'élément avant après son ajout à la page . Ainsi, au lieu d'essayer d'afficher l'élément lors du chargement de la page, affichez-le lorsque vous l'ajoutez à la page :

knowledgepanel.innerHTML = data;
$("#HungerGames").attr("open",true);