1
votes

Comment puis-je obtenir h1 innerText en JavaScript sans le innerText de son enfant?

Je veux obtenir le innerText de

sans le innerText à l'intérieur de la plage ... voici le HTML de la page:

<div class="col-md-12 header">
  <div class="col-md-8 info-header">
    <h1> This note is for h1 tag!!!!!! <span> this note is insidespan v226hql!!! </span>
    </h1>
  </div>
</div>

var title = document.querySelector('div.col-md-8.info-header h1');
title = title && title.innerText;
console.log(title);

mais cela renverra le innerText des deux

et .

que puis-je faire?

javascript html css-selectors

0 commentaires

3 Réponses :

3
votes

Une fois que vous avez sélectionné le parent, vous devrez sélectionner son nœud de texte enfant et obtenir le contenu de ce nœud:

<div class="col-md-12 header">
  <div class="col-md-8 info-header">
    <h1> This note is for h1 tag!!!!!! <span> this note is insidespan v226hql!!! </span>
    </h1>
  </div>
</div>

const h1 = document.querySelector('div.col-md-8.info-header h1');
const text = h1.childNodes[0].textContent;
console.log(text);

Malheureusement, il n'y a aucun moyen de naviguer directement vers un nœud de texte avec une chaîne de requête, vous devez donc d'abord passer par les childNodes . p >

4 commentaires

Cela ne contiendra-t-il pas le contenu de span interne qu'ils veulent éviter?

Non, vous pouvez appuyer sur Exécuter l'extrait de code pour le voir en action - il en résulte uniquement Cette note est pour la balise h1 !!!!!! , comme vous pouvez le voir dans la console de sortie d'extrait de code. childNodes [0] sélectionne le premier nœud enfant du parent, et le premier nœud enfant est le nœud de texte dont OP veut obtenir le contenu.

Il n'obtiendra pas tout le texte, si h1 a du texte après span el, il ne l'inclura pas.

Je t'ai eu. Je suis sur mobile. Cela fonctionne pour ce cas spécifique. J'avais pensé en termes généraux. Merci d'avoir expliqué.

1
votes

Essayez ceci.

var mainElement = document.getElementById("id_of_h1"),
    innerElements = mainElement.firstChild,
    innerTexts = [];

while (innerElements) {
    if (innerElements.nodeType == 3) {
        innerTexts.push(innerElements.data);
    }
    innerElements = innerElements.nextSibling;
}

var finalResult = innerTexts.join("");

finaresult contiendra uniquement l'intertexte de l'élément supérieur.

0 commentaires

0
votes

Si vous avez

`bonjour un autre monde`

et avez besoin d'obtenir tout le texte sauf les éléments html - bonjour le monde pas bonjour un autre monde , alors vous devez procéder de cette façon

<div class="col-md-12 header">
  <div class="col-md-8 info-header">
    <h1> This note is for h1 tag!!!!!! <span> this note is insidespan v226hql!!! </span> extra text without tag
    </h1>
  </div>
</div>

const h1 = document.querySelector('div.col-md-8.info-header h1');
const el = h1.childNodes;
let result = "";
for(i=0;i<el.length;i++){
   if(el[i].nodeName == '#text'){
     result+=el[i].textContent;
   }
}
console.log(result);

0 commentaires