Discussion :

[lautux]

Bonjour à tous,

Je suis confronté à un problème de Javascript.
Je souhaite récupérer tous les éléments HTML contenus dans une sélection faite avec la souris. J'arrive sans problème à récupérer le texte sélectionné, mais impossible de trouver un solution pour récupérer les objets du DOM (les balises HTML).

Connaissez-vous une solution ?

Merci

[benji_dv]

Bonjour,
Pour récupérer les éléments, tu peux passer par le fait d'obtenir la liste des enfant du noeud qui contient tes éléments.
Ex:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<DIV id="maDiv">
<INPUT type=checkbox value=001 ID="Checkbox1">
<INPUT type=checkbox value=002 ID="Checkbox2">
</DIV>

Pour récupérer les checkboxes (et éventuellement vérifier s'il ont étés sélectionnés) :
document.getElementByID("meDiv").children
puis pour chaque noeud enfant, je peux récupérer le innerText ou l'innerHTML
qui te donnerons le contenu des balises sans interprétation...

@+

[lautux]

Merci de ta réponse,

Je n'ai pas dû bien expliquer mon problème.

Imaginons un utilisateur qui sélectionne une partie d'une page web, par exemple "du texte avec un mot en gras".
Le but étant alors de récupérer tous le dom sélectionné par l'utilisateur, c'est-à-dire les nodes :
...-TEXT avec pour valeur : "du texte avec "
...- BOLD avec pour valeur :
......- TEXT avec pour valeur : "un mot"
...- TEXT avec pour valeur : " en gras"
Tous le DOM sélectionné en fait.

Ca ne semble pourtant pas très compliquer comme ça, je pense donc que ça doit bien être possible.

[benji_dv]

Bonjour,

Essai ca : (je nai aucun mérite je l'ai trouvé là : http://www.quirksmode.org/js/selected.html
et je n'ai que modifié la fin : alert...)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function getSel()
{
	var txt = '';
	var foundIn = '';
	if (window.getSelection)
	{
		txt = window.getSelection();
		foundIn = 'window.getSelection()';
	}
	else if (document.getSelection)
	{
		txt = document.getSelection();
		foundIn = 'document.getSelection()';
	}
	else if (document.selection)
	{
		txt = document.selection.createRange().text;
		foundIn = 'document.selection.createRange()';
	}
	else return;
	alert( 'Found in: ' + foundIn + '\n' + txt);
}

les trois moyens de récupérer le texte sélectionné dépendent du navigateur,
visite la page que j'ai placé ci dessus pour complément d'info

@+

[Eric Berger]Balises code ajoutées, merci d'y penser à l'avenir

[lautux]

Encore merci pour ton aide, mais...

Récupérer le TEXTE sélectionné, j'y arrive. Mais j'ai besoin de récupérer les NODES sélectionnés.
Au finial, je doit donc obtenir, non pas une simple chaine, mais un tableau d'éléments HTML, le petit bout de l'arbre DOM qui est sélectionné.

Je cherche... et suis preneur d'idées ;-)

[yacinechaouche]

Salut,
Petite piste : regarde comment fait l'éditeur que tu as utilisé (vbulletin) pour poster ton message sur ce forum. Sous firefox, en utilisant le plugin web developer, tu peux voir les fichiers javascript utilisés par une page. Voici ce que j'ai pu trouvé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
		/**
		* Get Selected Text
		*/
		this.get_selection = function()
		{
			var range = this.editdoc.selection.createRange();
			if (range.htmlText && range.text)
			{
				return range.htmlText;
			}
			else
			{
				var do_not_steal_this_code_html = '';
				for (var i = 0; i < range.length; i++)
				{
					do_not_steal_this_code_html += range.item(i).outerHTML;
				}
				return do_not_steal_this_code_html;
			}
		};

Sachant que this.editdoc est trés probablement un simple textarea.

Je pense que tu peux accéder aux noeuds sous mozilla avec

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
var node = range.startContainer;
var pos = range.startOffset;

Bon courage !

Y.Chaouche