«Есть ли функция JavaScript для поиска содержимого браузера с помощью элемента наведения мыши?» - PullRequest
Новая
       0

«Есть ли функция JavaScript для поиска содержимого браузера с помощью элемента наведения мыши?»

2 голосов
/ 30 апреля 2019

Я создаю расширение Google Chrome, используя HTML CSS и JavaScript.Как мы можем получить доступ к тексту содержимого браузера, используя DOM с помощью мыши, я могу получить только последний элемент child.Как я хочу получить дочерний элемент среднего уровня и первый элемент дочернего элемента любого div или span Вот мой код 

window.addEventListener("mouseover", test);
function test() {
  document.body.onmouseover = event => {
      let childLen = event.target.childElementCount

    if (event.target.lastChild) {
      if (event.target.lastChild.innerHTML) {
        event.target.style.border = "solid";
        console.log(event.target.lastChild.innerHTML)
      }
    }
  };
}

Вот мой HTML-код. 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>Document</title>
  </head>
  <body>
       <table>
          <tbody>
            <tr>
              <td id="myButtonOne" >
                <i
                  class="fa fa-hand-pointer fa-lg handicon"
                  aria-hidden="true"
                ></i>
              </td>
              <td id="Title" >Title: </td>
              <td  >
                <i class="fa fa-check-circle tick "  id="removeOne" aria-hidden="true"></i>
              </td>
            </tr>
</tbody>
</table>
</body>
</html>

Вот мой manifest.jsonкод файла 

{
  "manifest_version": 2,
  "name": "React Extention",
  "author": "Muhammad Yousuf",
  "version": "1.0.1",
  "options_page": "index.html",
  "description": "Replace new tab screen with GitHub trending projects.",
  "web_accessible_resources": ["index.html"],
  "incognito": "split",
  "icons": {
    "16": "logo.png",
    "48": "logo.png",
    "128": "logo.png"
  },
  "content_scripts": [
    {
     "matches": ["*://*.dawn.com/*"],
      "js": ["content-script.js"]
    }
  ],
  "browser_action": {
    "default_title": "Extention"
  },
  "background": {
    "scripts": ["background.js"],
    "presistent":false
  },
 "content_security_policy": "script-src 'self' 'sha256-GgRxrVOKNdB4LrRsVPDSbzvfdV4UqglmviH9GoBJ5jk='; object-src 'self'",

  "permissions": ["tabs", "http://*/*", "storage","activeTab"]

}

1 Ответ

0 голосов
/ 07 мая 2019

попробуйте это при наведении курсора мыши и нахождении в браузере содержимого. Текст 


// Previous dom, that we want to track, so we can remove the previous styling.
var prevDOM = null;

// Mouse listener for any move event on the current document.
document.addEventListener('mouseover', function (e) {
 var srcElement = e.srcElement;
 console.log('srcElement',srcElement.nodeName.trim());


 // Lets check if our underlying element is a DIV.
 if (srcElement.nodeName == 'SPAN' || srcElement.nodeName == "P" || srcElement.nodeName == "H1" || srcElement.nodeName == "H2" || srcElement.nodeName == "H3" || srcElement.nodeName == "H4" || srcElement.nodeName == "H5" || srcElement.nodeName == "H6"  || srcElement.nodeName == "UL"  || srcElement.nodeName == "LI"  || srcElement.nodeName == "A"  || srcElement.nodeName == "OL" ) {
   if(srcElement.textContent){
    // console.log('srcElement',srcElement.textContent);
     //console.log('srcElement length',srcElement.textContent.length);
     let selectedText = srcElement.textContent.toString()
     if(srcElement.textContent.length > 1){
       let message = {
         text: selectedText
       };
       chrome.runtime.sendMessage(message);


   // For NPE checking, we check safely. We need to remove the class name
   // Since we will be styling the new one after.
   if (prevDOM != null) {
     prevDOM.classList.remove(MOUSE_VISITED_CLASSNAME);
   }

   // Add a visited class name to the element. So we can style it.
   srcElement.classList.add(MOUSE_VISITED_CLASSNAME);

   // The current element is now the previous. So we can remove the class
   // during the next iteration.
   prevDOM = srcElement;
 }
}
 }
}, false);```
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...