素人がプログラミングを勉強していたブログ

プログラミング、セキュリティ、英語、Webなどのブログ since 2008

連絡先: twitter: @javascripter にどうぞ。

relを指定して要素を取得する

追記:正規表現が間違ってたので修正した。

getElementsByClassNameはあるのに、getElementsByRelNameはない。だから自作する必要がある。

HTMLElement.prototype.getElementsByRelName=function(relNames){
var rels=relNames.split(/\s/);
return Array.filter(this.getElementsByTagName('*'),
  function(i){
  var i_rel=i.getAttribute('rel');
  return rels.some(function(rel)RegExp('^|\\s'+rel+'\\s|$','i').test(i_rel))
  })
}
document.getElementsByRelName=function(relNames)
  document.documentElement.getElementsByRelName(relNames);

document.getElementsByRelName('next')

スペースで区切って複数指定することも出来る。
relの指定がひとつでいい場合はXPathを使って、

var str='next'.toLowerCase();
$x('//*[contains(concat(" ",normalize-space(translate(@rel, "ABCDEFGHIJKLMNOPQRSTUVWXYZ", "abcdefghijklmnopqrstuvwxyz"))," "), " '+str+' ")]');

と書くこともできる(要Firebug)。

microformatsとかで抽出する場合は後者のほうが短くていいと思う。XPathが複雑だけど。