マウスの下にあるタグの情報表示

できるだけ沢山の情報を出そうとしていたら、500文字超えてしまい
ブックマークレット分割せざるを得なくなった・・・・orz

「その1」をアドレスバーで実行後、「その2」を実行してください。
マウスの下にあるタグの属性がずらずら表示されます。

  • その1

<div>タグの挿入と、スタイルシートの追加処理

javascript:(function(){ document.body.insertAdjacentHTML('beforeEnd','<div class=\'f\' id=\'f\'></div>');var ss=document.styleSheets;if(ss.length>0)sht=ss[ss.length-1];else sht=document.createStyleSheet();sht.addRule('DIV.f','z-index:1;position:absolute;background-color:white;border:1px solid black;padding:2px;filter:alpha(opacity=90);-moz-opacity:0.8;'); })();

  • その2

マウス下にあるタグの情報を取得し、その1で追加した>div<タグで表示

javascript:(function(){document.body.onmousemove=function(){b=document.body;e=event;p=e.srcElement;att='';x=b.scrollLeft+e.clientX;y=b.scrollTop+e.clientY;f.style.left=x+10;f.style.top=y;for(i=0;i<p.attributes.length;i++){n=p.attributes[i].name;a=p.getAttribute(n);if( (-1==n.search(/^on/))&&(a!=null)&&(a.length>0))att+='<br>'+p.attributes[i].name+'='+a;}f.innerHTML=p.tagName+' x='+x+' y='+y+'<br>name='+p.name + att;};})()