chrome.tabs.executeScript()格式问题

时间:2016-10-04 01:07:01

标签: javascript jquery google-chrome-extension

我正在尝试更改网页上所有元素的字体颜色。我很难将这个for循环添加到代码中:在executeScript()函数内部。我哪里出错了?

popup.js

function main() {

    $("p").click(function () {
        var color = $(this).text();
        chrome.tabs.executeScript({
        code: 'var el = document.getElementByTagName("*"); for (var i=0; i < el.length; i++) { el[i].style.color = color;}'
        });
    });
}
$(document).ready(main);

的manifest.json

// metadata file containing basic properties

{
  "name": "Font Color Changer",
  "description": "Change the color of the current page's font.",
  "version": "1.0",
  "permissions": [
    "activeTab"
  ],
  "background": {
    "scripts": ["popup.js"],
    "persistent": false
  },
  "browser_action": {
    "default_title": "Change the font color!",
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

popup.html

<!DOCTYPE html>
<html>
    <title>popup for browser action</title>
    <head>
    <script src="jquery-3.1.1.min.js"></script>
    <script type ="text/javascript" src="popup.js"></script>

    <style>
        p {font-size: 20px; border: black solid 1px; text-align: center; padding: 2px;}
        a.red:link {text-decoration: none; color: red;}
        a.blue:link {text-decoration: none; color: blue;}
        a.black:link {text-decoration: none; color: black;}
        div.colors {float: left;}
        div.font {float:right;}
    </style>
</head>
<body>
<!-- parent div for the three different options -->
<div style = "width: 175px;">
    <!-- div for color selectors -->
    <div class = "colors">
        <p><a class = "red" href="#">red</a></p>
        <p><a class = "blue" href="#">blue</a></p>
        <p><a class = "black" href="#">black</a></p>
    </div>
    <!-- div for font-family selectors -->
    <div class = "font">
        <p>Comic Sans</p>
        <p>Calibri</p>
        <p>Reset</p>
    </div>
</div>
</body>

1 个答案:

答案 0 :(得分:2)

您缺少 $(this).parent('div').parent('div').remove() 的第一个参数; SECTION .data Median: num: db "%d " , 10, 0 SECTION .bss SECTION .text extern printf global main main: nop push ebp mov ebp, esp push ebx push esi push edi ;boiler plate ;start of main code ;first loop to adding summation xor edx, edx xor eax, eax xor esi, esi xor ecx, ecx xor edi, edi xor ebx, ebx xor ebp, ebp L1: ;n-1 counter mov ecx, 2 inc ebx ;start of n // counter mov eax, ebx sub eax, 1 mul ebx div ecx mov esi, eax ;value from here mov ebp, ebx ;start of n+1 to add to see if equal add ebp, 1 ;n+1 cmp ebp, esi jne compare compare: ;if n+1 does not equal to esi add next value to n+1 mov eax, ebp add eax, 1 add ebp, eax cmp ebp, esi je print jmp lessthan lessthan: cmp ebp, esi jle compare jge L1 print: mov eax, ebx push eax push num call printf add esp, 8 mov edi, ebx jmp L1 done:; finishes the loops/boilerplate after this pop edi pop esi pop ebx mov esp,ebp pop ebp ret 之后.executeScript遗失document.getElementByTagName(); "s"来电未定义Element; jQuery没有必要返回预期的结果。

color调整为

.executeScript

popup.html到

popup.js

的manifest.json

function click(e) {
  chrome.tabs.executeScript(null, {
    code: "var el = document.getElementsByTagName('*'); " 
          + "for (var i=0; i < el.length; i++) { el[i].style.color ='" 
          + e.target.textContent 
          + "'}"
  });
  window.close();
}

document.addEventListener("DOMContentLoaded", function(e) {
  var p = document.querySelectorAll('p');
  for (var i = 0; i < p.length; i++) {
    p[i].addEventListener('click', click);
  }
});

请参阅A browser action with a popup that changes the page color