DOM : saisir le nombre de résultats dans google scholar

**thibaud74** · 21/07/2010, 14h58

Bonjour !

Je souhaite accéder dans le DOM au nombre de résultats dans google scholar, mais sans id, je trouve cela un peu compliqué !

D'après mon examen du DOM, je devrais obtenir ce nombre lorsque j'injecte le code suivant dans la barre d'adresse :

Code :

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

1
2
javascript:
alert(typeof document.getElementById('scife_hdr').parentNode.lastChild.firstChild.lastChild.lastChild.firstChild[2].nodeValue );

Le typeof me permet de vérifier si ce que j'obtiens est correct. Or, à partir du moment où j'ajoute [2].nodeValue, je n'obtiens plus Object comme résultat mais rien du tout... où est l'erreur ?

Voici une image de la structure du noeud que j'essaie d'atteindre :

En grisé, la valeur à atteindre.

Si vous préférez, voici le code de la partie FORM concernée, mais je ne la trouve pas bien claire. Dans cet exemple, la valeur recherchée est "30,100".

Code :

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

<form xmlns="http://www.w3.org/1999/xhtml" action="/scholar" method="GET" name="gs"><div id="scife_hdr"><div width="189" style="float: left; margin: 0pt;"><a target="_top" href="/schhp?hl=en&amp;as_sdt=2000"><img border="0" width="189" vspace="2" height="40" alt="Scholar Home" src="/intl/en/images/scholar_logo_md_2009.gif" /></a></div><div style="margin-left: 189px;"><div style="margin-left: 10px;"><table cellspacing="0" cellpadding="0" border="0" style="margin: 1px 3px 1px 0px;"><tbody><tr><td nowrap="nowrap"><input type="hidden" value="en" name="hl" /><input type="text" value="compiègne" maxlength="2048" size="41" name="q" /><font size="-1"> <input type="submit" value="Search" name="btnG" /></font></td><td>**</td><td valign="top" nowrap="nowrap"><font size="-2"><a href="/advanced_scholar_search?q=compi%C3%A8gne&amp;hl=en&amp;as_sdt=2000">Advanced Scholar Search</a><br /><a href="/scholar_preferences?q=compi%C3%A8gne&amp;hl=en&amp;as_sdt=2000">Scholar Preferences</a><br /></font></td></tr></tbody></table></div></div></div><table cellspacing="0" cellpadding="0" border="0" bgcolor="#dcf6db" width="100%"><tbody><tr><td bgcolor="#008000" colspan="2"><img width="1" height="1" alt="" /></td></tr><tr><td bgcolor="#dcf6db" nowrap="nowrap"><font size="+1"> <b>Scholar</b></font>* <select onchange="document.gs.submit()" name="as_sdt"><option selected="selected" value="2000">Articles and patents</option><option value="2001">**Articles excluding patents</option><option value="2002">Legal opinions and journals</option><option value="2003">**Federal cases</option><option value="2004">**California cases</option><option value="2000!">  Advanced search…</option></select> <select onchange="document.gs.submit()" name="as_ylo"><option selected="selected" value="">anytime</option><option value="2010">since 2010</option><option value="2009">since 2009</option><option value="2008">since 2008</option><option value="2007">since 2007</option><option value="2006">since 2006</option><option value="2005">since 2005</option><option value="2004">since 2004</option><option value="2003">since 2003</option><option value="2002">since 2002</option><option value="2001">since 2001</option><option value="2000">since 2000</option><option value="1999">since 1999</option><option value="1998">since 1998</option><option value="1997">since 1997</option><option value="1996">since 1996</option><option value="1995">since 1995</option><option value="1994">since 1994</option><option value="1993">since 1993</option><option value="1992">since 1992</option><option value="1991">since 1991</option></select> <select onchange="document.gs.submit()" name="as_vis"><option selected="selected" value="0">include citations</option><option value="1">at least summaries</option></select>**<a href="/scholar_alerts?view_op=create_alert_options&amp;hl=en&amp;alert_query=intitle:compi%C3%A8gne&amp;alert_params=hl%3Den%26as_sdt%3D2000"><img border="0" align="texttop" width="22" height="19" title="Create email alert" src="/scholar/scholar_envelope.png" /></a>*<font size="-1"><a href="/scholar_alerts?view_op=create_alert_options&amp;hl=en&amp;alert_query=intitle:compi%C3%A8gne&amp;alert_params=hl%3Den%26as_sdt%3D2000">Create email alert</a></font></td><td bgcolor="#dcf6db" align="right" nowrap="nowrap"><font size="-1">Results <b>1</b> - <b>10</b> of about <b>30,100</b>.   (<b>0.11</b> sec)*</font></td></tr></tbody></table></form>

Merci de l'aide,
Thibaud.

**SpaceFrog** · 21/07/2010, 17h39

Code :

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

firstChild[2]

firstChild n'a jamais retourné une collection

**Watilin** · 21/07/2010, 18h40

Envoyé par thibaud74

Bonjour !

[…] lorsque j'injecte le code suivant dans la barre d'adresse : […]

Argh, douleur… Si j’étais à ta place ça ferait bien longtemps que je serais chauve à force de m’arracher les cheveux. Enfin, voyons le bon côté des choses : ça enseigne la patience

Tu vas faire un bond lunaire en productivité si tu te trouves un outil de développement.

sous Firefox : l’extension Firebug
sous IE8 : déjà installé (F12)
sous Google Chrome, Opera et Safari/windows : déjà installé (Ctrl+Maj+I)

Ensuite, j’ai envie de dire : la vache, ce problème est vraiment pénible, effectivement y’a pas un seul id ni une seule classe pour nous aider…

Le but c’est d’avoir une expression de sélection qui dépende le moins possible de la structure de la page, afin d’avoir un script qui tolère un tant soit peu les mises à jour de Google… Actuellement, si Google rajoute un élément après le <table> du <div id="scife_hdr">, ça va foirer au niveau du premier parentNode…

❧

Y’a quand même un peu plus simple que ce que tu as trouvé. Par exemple on a les attributs nextSibling et previousSibling pour naviguer entre des nœuds voisins. Le problème c’est les nœuds #text…

Sur des projets légers, sans framework, les fonctions dans ce genre sont utiles :

Code js :

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
/*
 * retourne le premier élément suivant current,
 * correspondant à expected si demandé ;
 * renvoie null si pas trouvé
 * parametres:
 * 	current: nœud DOM
 * 	expected: (optionnel) string
 */
function nextElement( current, expected ) {
	var next = current.nextSibling;
	while (!(
		next === null || (
			next.nodeType == 1 && (
				!expected || next.nodeName == expected.toUpperCase()
			)
		)
	)) {
		next = next.nextSibling;
	};
	return next;
};
 
/*
 * tout pareil mais dans l'autre sens
 */
function previousElement( current, expected ) {
	var previous = current.previousSibling;
	while (!(
		previous === null || (
			previous.nodeType == 1 && (
				!expected || previous.nodeName == expected.toUpperCase()
			)
		)
	)) {
		previous = previous.previousSibling;
	};
	return previous;
};
 
/*
 * pareil avec les enfants, en partant du début
 */
function firstElement( current, expected ) {
	var child = current.firstChild;
	if (!(
		child === null || (
			child.nodeType == 1 && (
				!expected || child.nodeName == expected.toUpperCase()
			)
		)
	)) {
		child = nextElement(child, expected);
	};
	return child;
};
 
/*
 * pareil avec les enfants, en partant de la fin
 */
function lastElement( current, expected ) {
	var child = current.lastChild;
	if (!(
		child === null || (
			child.nodeType == 1 && (
				!expected || child.nodeName == expected.toUpperCase()
			)
		)
	)) {
		child = previousElement(child, expected);
	};
	return child;
};

(Les toUpperCase() c’est parce que les nodeName sont en majuscules dans le DOM.)

En l’occurence, ceci permettrait de s’assurer un peu mieux de saisir le bon tableau au départ :

Code js :

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

var bonTableau = nextElement(document.getElementById('scife_hdr'), 'table');

Enfin je te sors ça pour info mais, pour le reste, ça me fait vraiment ch*** de fouiller dans le DOM sans aucune garantie alors je sors l’arme lourde : la Regexp !

Et puis sans aucune subtilité je vais passer cette regexp sur le innerHTML de notre tableau.
Voici l’animal :

Code :

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

/environ\s+<b>([\d&nbsp;]+)<\/b>/

Le principe c’est de repérer la balise <b> qui suit le mot « environ ». On se méfie des espaces (\s+), il pourrait y en avoir plusieurs dans le code source…
Ensuite, la balise ne contient en principe que des nombres (\d) et des espaces insécables ( ).
Enfin, les parenthèses permettent de capturer le contenu intéressant.

La méthode match() des strings renvoie un tableau quand on l’utilise avec une regexp. Le premier élément contient la correspondance totale, et les suivants sont les parties capturées.
Exemple :

Code js :

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

1
2
"aabbcc".match( /b*(c*)/ )
// => ["bbcc", "cc"]

Là je pense que tu commences à comprendre…

Code js :

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

1
2
3
4
5
var capture = bonTableau.innerHTML.match( /environ\s+<b>([\d&nbsp;]+)<\/b>/ )[1];
// on a un truc du style "1&nbsp;200$nbsp;000"
capture = capture.replace( /&nbsp;/g, '' );
// conversion finale !
var results = Number(capture);

Pour être totalement indépendant on peut carrément parser le innerHTML du body (ça sera assez rapide car il n’a que le haut de la page à analyser).
Ça pourrait même tenir en une ligne ^^

Code :

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

var results = Number(document.body.innerHTML.match(/environ\s+<b>([\d&nbsp;]+)<\/b>/)[1].replace(/&nbsp;/g, ''));

Valà, bon si ton objectif c’est d’utiliser le DOM je suis HS, mais dans un cas retors comme celui-ci…

**thibaud74** · 22/07/2010, 09h55

Merci @Watilin pour cet excellent exposé très pédagogique ! J'avais installé firebug, mais je n'avais pris le temps de comprendre son utilisation, donc j'ai activé la console, effectivement c'est pratique !
Ensuite, j'ai un souci avec les deux méthodes que tu présentes, à cause de l'internationalisation. En effet, une recherche en japonais, non seulement rend inutilisable le mot "environ" dans la regex, mais inverse aussi l'ordre des balises ! Donc il faut utiliser une regex de toute façon, même en utilisant le DOM...

Voici le code en japonais avec 1 résultat sur 1 :

Code :

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

<td bgcolor=#dcf6db align=right nowrap><font size=-1><b>1</b>件中<b>1</b> - <b>1</b>件目 （<b>0.07</b> 秒）&nbsp;</font></td>

@SpaceFrog: oui il faut que je revois mes fondamentaux.

**thibaud74** · 22/07/2010, 12h14

J'y suis ! J'ai utilisé les fonctions indiquées par Watilin auxquelles j'ai ajouté une méthode qui permet de trouver une valeur maximale dans un tableau. Je récupère le nœud table, puis ce qui est dans la balise <font size=-1>. Là-dedans je récupère les nombres et je prend le plus grand, puisqu'on a une phrase du style pages 1 à 10 sur 495 document en 3 secondes.
Peut-être y a-t-il des améliorations à faire ?

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
/*
 * retourne le premier élément suivant current,
 * correspondant à expected si demandé ;
 * renvoie null si pas trouvé
 * parametres:
 * 	current: nœud DOM
 * 	expected: (optionnel) string
 */
function nextElement( current, expected ) {
	var next = current.nextSibling;
	while (!(
		next === null || (
			next.nodeType == 1 && (
				!expected || next.nodeName == expected.toUpperCase()
			)
		)
	)) {
		next = next.nextSibling;
	};
	return next;
};
 
/*
 * tout pareil mais dans l'autre sens
 */
function previousElement( current, expected ) {
	var previous = current.previousSibling;
	while (!(
		previous === null || (
			previous.nodeType == 1 && (
				!expected || previous.nodeName == expected.toUpperCase()
			)
		)
	)) {
		previous = previous.previousSibling;
	};
	return previous;
};
 
/*
 * pareil avec les enfants, en partant du début
 */
function firstElement( current, expected ) {
	var child = current.firstChild;
	if (!(
		child === null || (
			child.nodeType == 1 && (
				!expected || child.nodeName == expected.toUpperCase()
			)
		)
	)) {
		child = nextElement(child, expected);
	};
	return child;
};
 
/*
 * pareil avec les enfants, en partant de la fin
 */
function lastElement( current, expected ) {
	var child = current.lastChild;
	if (!(
		child === null || (
			child.nodeType == 1 && (
				!expected || child.nodeName == expected.toUpperCase()
			)
		)
	)) {
		child = previousElement(child, expected);
	};
	return child;
};
 
Array.prototype.max = function() {
	var max = this[0];
	var len = this.length;
	for (var i = 1; i < len; i++) if (this[i] > max) max = this[i];
	return max;
}
 
 
var bonTableau = nextElement(document.getElementById('scife_hdr'), 'table');
// This script get : the table node, the "font=-1" node, delete the float number, make a table with numbers only, max of them
var capture = bonTableau.innerHTML.replace(/^.*<font size=\"\-1\">/,'').replace(/<\/font>.*$/,'').replace(/[0-9]+\.[0-9]+/,'').replace(',','').match(/(\d[,\d]*)/g);
// match( /<b>([\d&nbsp;]+)<\/b>/g )[1];
alert(capture + "\nMAX=" + capture.max());

Merci,

Thibaud.

**Watilin** · 22/07/2010, 12h58

Ok sinon moi j’étais en train de peaufiner une solution « à la bourrin », voilà le code, j’ai testé sur des pages françaises, arabes, russes et japonaises…

Code grosse brute :

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
function grosseBrute() {
	var pageCode = document.body.innerHTML;
	var re = /<b>(\d+(?:[^\d<]*\d\d\d)*)<\/b>/g;
 
	var nums = [];
	for (i = 3; i--;) {
		matching = re.exec(pageCode);
		if (!matching) throw new Error('pas assez de balises <b>');
		nums.push(Number(matching[1].replace(/\D+/g, '')));
	};
	var max = 0;
	for (var i = 0, n; n = nums[i]; i++) {
		if (n > max) {
			max = n;
		};
	};
	return max;
};

Plus court, et totalement indépendant du DOM

**thibaud74** · 22/07/2010, 13h38

Bravo, ça marche ! Mais peux-tu m'expliquer l'expression régulière, ces parenthèses imbriquées ? Apparemment du récupère tout les nombres dans la balise gras, mais je ne comprend pas bien comment tu obtiens la bonne série de nombres ?

**thibaud74** · 22/07/2010, 16h26

Je te remercie Watilin

DOM : saisir le nombre de résultats dans google scholar

JavaScript

Vue hybride

Discussions similaires

Partager

Partager