Javascript自动化按钮

时间:2017-11-13 04:15:59

标签: javascript jquery google-chrome-extension

我刚刚开始使用Javascript,我想知道是否有人可以帮助我。

作为模板,我下载了chrome的突出显示扩展程序,并使用它的代码开始。我想自动化插件中的一个功能,即为了开始突出显示,你必须输入一个单词并按" save"在选项页面中。

我能够自动在文本框中插入单词,因此您无法输入,但仍需按下保存按钮。有谁知道如何自动执行此功能,所以你不必这样做?谢谢!

Common.js:

function loadOptions() {
    if ("undefined" != typeof localStorage) {
        document.getElementById("textareaKeywords").value = "wikipedia";
        document.getElementById("colorForeground").value = "#000000";
        document.getElementById("colorBackground").value = "#ff0000";

        var showOccurrences = false;
        showOccurrences = "true" == showOccurrences || null == showOccurrences;
        document.getElementById("checkboxShowOccurrences").checked = showOccurrences;
    }
}

function saveOptions() {
    if ("undefined" != typeof localStorage) {
        localStorage.setItem("keywords", document.getElementById("textareaKeywords").value);
        localStorage.setItem("foreground", document.getElementById("colorForeground").value);
        localStorage.setItem("background", document.getElementById("colorBackground").value);
        localStorage.setItem("showOccurrences", document.getElementById("checkboxShowOccurrences").checked);
    }
}

Options.js:

document.addEventListener("DOMContentLoaded", function() {
    loadOptions();

    document.getElementById("buttonReset").addEventListener("click", function() {
        loadOptions();
    });

    document.getElementById("buttonSave").addEventListener("click", function() {
        saveOptions();
    });
});

Content.js:

function keywordsHighlighter(options, remove) {
    var occurrences = 0;

    // Based on "highlight: JavaScript text higlighting jQuery plugin" by Johann Burkard.
    // http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
    function highlight(node, pos, keyword, options) {
        var span = document.createElement("span");
        span.className = "highlighted";
        span.style.color = options.foreground;
        span.style.backgroundColor = options.background;

        var highlighted = node.splitText(pos);
        /*var afterHighlighted = */highlighted.splitText(keyword.length);
        var highlightedClone = highlighted.cloneNode(true);

        span.appendChild(highlightedClone);
        highlighted.parentNode.replaceChild(span, highlighted);

        occurrences++;
    }

    function addHighlights(node, keywords, options) {
        var skip = 0;

        var i;
        if (3 == node.nodeType) {
            for (i = 0; i < keywords.length; i++) {
                var keyword = keywords[i].toLowerCase();
                var pos = node.data.toLowerCase().indexOf(keyword);
                if (0 <= pos) {
                    highlight(node, pos, keyword, options);
                    skip = 1;
                }
            }
        }
        else if (1 == node.nodeType && !/(script|style|textarea)/i.test(node.tagName) && node.childNodes) {
            for (i = 0; i < node.childNodes.length; i++) {
                i += addHighlights(node.childNodes[i], keywords, options);
            }
        }

        return skip;
    }

    function removeHighlights(node) {
        var span;
        while (span = node.querySelector("span.highlighted")) {
            span.outerHTML = span.innerHTML;
        }

        occurrences = 0;
    }

    if (remove) {
        removeHighlights(document.body);
    }

    var keywords = options.keywords.split(",");
    delete options.keywords;
    addHighlights(document.body, keywords, options);

    chrome.runtime.sendMessage({
        "message": "showOccurrences",
        "occurrences": occurrences
    });
}

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    if ("returnOptions" == request.message) {
        if ("undefined" != typeof request.keywords && request.keywords) {
            keywordsHighlighter({
                    "keywords": request.keywords,
                    "foreground": request.foreground,
                    "background": request.background
                },
                request.remove
            );
        }
    }
});

chrome.runtime.sendMessage({
    "message": "getOptions",
    "remove": false
});

如果我在这里放了太多代码,我很抱歉,我不知道需要改变什么或者需要多少或者在哪里。

0 个答案:

没有答案