回答編集履歴

2

ちゃんと動かないケースがあるので修正

2016/11/26 21:10

投稿

ryls-nmm
ryls-nmm

スコア633

test CHANGED
@@ -50,7 +50,7 @@
50
50
 
51
51
  次のようにしてみてください
52
52
 
53
- ```
53
+ ```javascript
54
54
 
55
55
  $(function(){
56
56
 
@@ -93,3 +93,81 @@
93
93
  検索結果の更新を監視して変化があったら再度ファビコンをつける処理を行います
94
94
 
95
95
 
96
+
97
+ 追記2
98
+
99
+ ----
100
+
101
+
102
+
103
+ エラーは最初の DOM 構築したときに #sample がないことが原因で起きているようです
104
+
105
+ リロードしたとき、Chrome の Omnibox(URLいれるとこ)からの検索、Google 検索結果の再検索等で細かい動きが違うので動く場合と動かない場合、2つアイコンが出る場合が発生しているようです
106
+
107
+
108
+
109
+ ちょっと無理矢理感もありますけど修正しました
110
+
111
+
112
+
113
+ ```javascript
114
+
115
+ $(function(){
116
+
117
+ function attachFavicon(){
118
+
119
+ if($("img.favi").length) return
120
+
121
+
122
+
123
+ $("h3.r a").each(function(){
124
+
125
+ var domain = this.host;
126
+
127
+ var favget = "//www.google.com/s2/favicons?domain="+domain;
128
+
129
+ var favgethtml = "<img src='"+favget+"' class='favi'/>";
130
+
131
+ $(this).parent().prepend(favgethtml);
132
+
133
+ });
134
+
135
+ }
136
+
137
+
138
+
139
+ const mo1 = new MutationObserver(_ => {
140
+
141
+ if($("#search").length === 0) return
142
+
143
+
144
+
145
+ mo2.observe($("#search").get(0), {childList: true})
146
+
147
+
148
+
149
+ mo1.disconnect()
150
+
151
+ })
152
+
153
+ const mo2 = new MutationObserver(_ => {
154
+
155
+ attachFavicon()
156
+
157
+ })
158
+
159
+
160
+
161
+ mo1.observe(document.body, {childList: true, subtree: true})
162
+
163
+
164
+
165
+ attachFavicon()
166
+
167
+ })
168
+
169
+ ```
170
+
171
+
172
+
173
+ ふたつアイコンが表示されないようにすでに favicon が存在するときは何もしない分岐と #search が作られてから再検索監視を始めるようにしました

1

追加質問に追記

2016/11/26 21:10

投稿

ryls-nmm
ryls-nmm

スコア633

test CHANGED
@@ -31,3 +31,65 @@
31
31
  一応動作確認しています
32
32
 
33
33
  また `h3.r a` というセレクタで検索結果のタイトルを取得していますが、ここは Google の気分で将来的にかわるかもしれません
34
+
35
+
36
+
37
+
38
+
39
+ 追記
40
+
41
+ ----
42
+
43
+
44
+
45
+ Google の検索結果の画面で再検索した場合はリロードせず検索結果だけを更新しています
46
+
47
+ 上のコードだとロードしたときに一回だけファビコンをつけるので再検索したあとはつきません
48
+
49
+
50
+
51
+ 次のようにしてみてください
52
+
53
+ ```
54
+
55
+ $(function(){
56
+
57
+ function attachFavicon(){
58
+
59
+ $("h3.r a").each(function(){
60
+
61
+ var domain = this.host;
62
+
63
+ var favget = "//www.google.com/s2/favicons?domain="+domain;
64
+
65
+ var favgethtml = "<img src='"+favget+"' class='favi'/>";
66
+
67
+ $(this).parent().prepend(favgethtml);
68
+
69
+ });
70
+
71
+ }
72
+
73
+
74
+
75
+ const mo = new MutationObserver(_ => {
76
+
77
+ attachFavicon()
78
+
79
+ })
80
+
81
+ mo.observe($("#search").get(0), {childList: true})
82
+
83
+
84
+
85
+ attachFavicon()
86
+
87
+ })
88
+
89
+ ```
90
+
91
+
92
+
93
+ 検索結果の更新を監視して変化があったら再度ファビコンをつける処理を行います
94
+
95
+