htmlページ内の利用していないclassを抽出する!

今回、html内で利用していないclassを探して、htmlをキレイにする企画があり、大量の膨大なhtmlをチェックする為、shellでチェック処理を作成してみました。

#!/bin/bash

outputFile="./notUsedClassName.result"

echo "" > ${outputFile}

for file in `\find . -name "*.html" -type f`; do
    # TODO
    echo "[${file}]" >> ${outputFile}
    pathName=$(dirname ${file})

    # そのページで読み込んでいるclassを抽出
    classArray=($(egrep -o -i -h "class=\".*?\"" "${file}" | sed -e 's/[^"]*"\([^"]*\)".*/\1/' | sort | uniq | tr '\n' ' '))
    delClassArray=${classArray[@]}
    echo "class -> [${delClassArray[@]}]" >> ${outputFile}

    # そのページで読み込んでいるCSSを抽出
    cssFileArray=($(egrep -o -i -h "href=\".*?\.css\"" "${file}" | sed -e 's/[^"]*"\([^"]*\)".*/\1/' | tr '\n' ' '))

    for i in ${classArray[@]}
    do
      classUsed=0

      for j in ${cssFileArray[@]}
      do

        if [[ ${j} =~ ^/ ]]; then
          tmp=.${j}
        else
          tmp=${pathName}/${j}
        fi

        echo "${j} ${i} ${tmp}"

        dummy=$(grep -o -i ${i} ${tmp})
        ret=$?

        echo ${i} ${j} ${ret}

        if [ ${ret} = 0 ]; then
          classUsed=1
          break
        fi

      done
      if [ ${classUsed} = 0 ]; then
        echo "class not used ${i}" >> ${outputFile}
      fi
    done


done

結果後にhtmlの置換などの処理を入れたげれば、一括置換処理にも利用できるかと思います。ご自由にご利用ください。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA