常連

注目の的

回答者

拍手喝采

自己紹介

以下のようなテキストからonmouseoverでイベントを取得してあるtextにマウスを当てた時、該当テキストの情報を取得したいです。

```
<span id="test" style="font-weight:bold;">sed ullamcorper id,</span> eleifend in quam. Nulla facilisi. Aliquam vitae orci arcu. Aenean a nulla volutpat ante ultrices euismod 
```

```
document.onmouseover = function(){
  
};
```

上記のテキストでは


```
<span id="test" style="font-weight:bold;">sed ullamcorper id,</span>
```

この部分にマウスを当てた時、今当ててるテキストのelement情報を取得してconsole.logに表示したいです。
もし参考にできる情報がありましたら教えていただければ大変助かります。



以前はテキストをhighlightした時、選択されたtxtのelement情報を取得する方として以下のようなメソッドを使いました。


```
window.getSelection().anchorNode.parentNode
```

上記のような方法と似た感じで取得する方法がありましたらご教示いただけますか。

あるtextにonmouseoverしたらそのtextのelement情報を取得する方法

###前提・実現したいこと
表に〇✕を記入していき、スコアボードのように◯の数を数えて点数を表示できるようにしたいです。得点を表示する場所は真ん中のセルです。（2 - 1のように中央にハイフンを使って左と右の点数を表示したいです。）
###HTMLのソースコード
```ここに言語を入力
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
    <script src="components/loader.js"></script>
    <link rel="stylesheet" href="components/loader.css">
    <link rel="stylesheet" href="css/style.css">
    <script type="text/javascript" charset="utf-8" src="js/app.js"></script>
</head>
<body>
  <input type="button" name="maru" value="◯" onClick="getPoint(1), countPoint(1)">
    <input type="button" name="batu" value="✕" onClick="getPoint(2), countPoint(2)">
    <input type="button" name="clear" value="clear" onClick="getPoint(3), countPoint(3)">
  <br />
    <table border="1">
    <tr>        
        <td height = "60" width="35" rowspan="2">A</td>
        <td id="1" height = "30" width="16"></td>
        <td id="3"height = "30" width="16"></td>
        <td id="5" height = "30" width="16"></td>
        <td id="7" height = "30" width="16"></td>
        <td id="9" height = "30" width="16"></td>
        <td id="11" height = "30" width="16"></td>
        <td id="13" height = "30" width="16"></td>
        <td id="15" height = "30" width="16"></td>
        <td id="17" height = "30" width="16"></td>
        <td id="19" height = "30" width="16"></td>
        <td id="21" height = "30" width="16"></td>
        <td id="23" height = "30" width="16"></td>
        <td id="25" height = "30" width="16"></td>
        <td id="27" height = "30" width="16"></td>
        <td id="count1" height = "60" width="45" rowspan="2"></td>
        <td height = "60" width="35" rowspan="2">B</td>
        <td id="2" height = "30" width="16"></td>
        <td id="4" height = "30" width="16"></td>
        <td id="6" height = "30" width="16"></td>
        <td id="8" height = "30" width="16"></td>
        <td id="10" height = "30" width="16"></td>
        <td id="12" height = "30" width="16"></td>
        <td id="14" height = "30" width="16"></td>
        <td id="16" height = "30" width="16"></td>
        <td id="18" height = "30" width="16"></td>
        <td id="20" height = "30" width="16"></td>
        <td id="22" height = "30" width="16"></td>
        <td id="24" height = "30" width="16"></td>
        <td id="26" height = "30" width="16"></td>
        <td id="28" height = "30" width="16"></td>
    </tr>
    <tr>
        <td id="29" height = "30" width="16"></td>
        <td id="31" height = "30" width="16"></td>
        <td id="33" height = "30" width="16"></td>
        <td id="35" height = "30" width="16"></td>
        <td id="37" height = "30" width="16"></td>
        <td id="39" height = "30" width="16"></td>
        <td id="41" height = "30" width="16"></td>
        <td id="43" height = "30" width="16"></td>
        <td id="45" height = "30" width="16"></td>
        <td id="47" height = "30" width="16"></td>
        <td id="49" height = "30" width="16"></td>
        <td id="51" height = "30" width="16"></td>
        <td id="53" height = "30" width="16"></td>
        <td id="55" height = "30" width="16"></td>
        
        <td id="30" height = "30" width="16"></td>
        <td id="32" height = "30" width="16"></td>
        <td id="34" height = "30" width="16"></td>
        <td id="36" height = "30" width="16"></td>
        <td id="38" height = "30" width="16"></td>
        <td id="40" height = "30" width="16"></td>
        <td id="42" height = "30" width="16"></td>
        <td id="44" height = "30" width="16"></td>
        <td id="46" height = "30" width="16"></td>
        <td id="48" height = "30" width="16"></td>
        <td id="50" height = "30" width="16"></td>
        <td id="52" height = "30" width="16"></td>
        <td id="54" height = "30" width="16"></td>
        <td id="56" height = "30" width="16"></td>
    </tr>  
</table>
</body>
</html>
```

###JavaScriptのソースコード
```ここに言語を入力
var n = 1;
function getPoint(btnNo){
    var x = "◯"; //得点
    var y = "✕"; //失点
    var z = ""; //消す
    if(btnNo == 1){
        document.getElementById(n.toString()).textContent = x;
        n = n+1;
        document.getElementById(n.toString()).textContent = y;
        n = n+1;
    }else if(btnNo == 2){
        document.getElementById(n.toString()).textContent = y;
        n = n+1;
        document.getElementById(n.toString()).textContent = x;
        n = n+1;
    }else if(btnNo == 3){
        if (n>1){
        n = n-1;
        document.getElementById(n.toString()).textContent = z;
        n = n-1;
        document.getElementById(n.toString()).textContent = z;
        }
    }
}

function countPoint(btnNo){
    var countx = $( 'td:contains("◯")').length; //左のポイント
    var county = $( 'td:contains("✕")').length; //右のポイント
    if(btnNo == 1){
       document.getElementById("count1").textContent = countx;
    }else if(btnNo == 2){
       
    }else if(btnNo == 3){
       
    }
}
```
###試したこと
$( 'td:contains("◯")').length;でセルの◯の個数を取り出せるかと思って使ってみたのですが、表示されませんでした。

###補足情報(言語/FW/ツール等のバージョンなど)
HTML JavaScript

tableのセルに入っている特定の文字をカウントしてその数を表示したいです。

サーバ管理していると、レンタルサーバ会社、レンタルサーバ会社の管理コンソールへのログインＩＤ，パスワード、サーバへのログインＩＤ，パスワードから、ＤＩＳＫ容量、ＯＳ，メモリ、ドメイン、アプリ構成と多岐にわたってデータを管理する必要があります。ソフトウェアインベントリまで真面目につくるとかなり大変です。

そういったサーバ関連の文書というかデータの管理をするよいお手本（ベストプラクティス）的なものはあるでしょうか？

今、私が試しているのは、redmine ベースです。Redmine は単なる例示なので、なんでもいいです。git を使っている人もいるでしょうし、いろいろだと思います。trello ,pivotaltracker などを活用されている方もいらっしゃるかと思います。

zabbix のインベントリ管理ができるといいのですが、多岐に渡り、履歴までとりたいようなのにはすぐには対応できないように見えます。

zabbix のプラグインでばっちりなのがあったら、もちろん歓迎です。
上記では違うのですが、blackbird も結構行ける気がしています。