[JS] Find on Page – Bookmarklet(Perform Case-Sensitive)

當初作者會寫這個 Script 好像是因為瀏覽器內建的「尋找」功能不會區分大小寫...
This JavaScript bookmarklet will perform case-sensitive search in Google Chrome or any other browser include mobile Safari.
The Find bar (Ctrl + F) in Firefox offers a 「Match Case」 option to help you perform case-sensitive searches on a web page. If you type 「RAM」 in the find box, the browser will only highlight the phrase 「RAM」 on that page and not Ram or ram.

It is however not possible to do a case-sensitive search inside Google Chrome. People have been requesting this feature since the early days of Chrome but the request was turned down citing the following reason:
Discussed with UI leads. This [case sensitive search in Chrome] would be nice to have, but we're not willing to add the options to the UI at this time. (Issue #187)
It is therefore less likely that case-sensitive search would make it to Google Chrome anytime soon but as a workaround, you can use this little bookmarklet.

所以說就有人寫了這個 JS 來完成可以區分大小寫的搜尋以及高亮...

1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
/* Bookmarklet Case-Sensitive Search */
 
function () {
   
    /* Prompt the user for search terms */
    var text = prompt("Search for:", "");
    if (text == null || text.length == 0) return;
    
    /* If there any previously highlighed words,
    remove them by setting the background to transparent */
    
    var spans = document.getElementsByClassName("labnol");
    
    if (spans) {
        for (var i = 0; i < spans.length; i++) {
            spans[i].style.backgroundColor = "transparent";
        }
    }    
    
    /* Search Code is courtesy Jesse Ruderman */
    function searchWithinNode(node, te, len) {
        var pos, skip, spannode, middlebit, endbit, middleclone;
        skip = 0;
        if (node.nodeType == 3) {
            pos = node.data.indexOf(te);
            if (pos >= 0) {
                spannode = document.createElement("span");
                spannode.setAttribute("class", "labnol");
                spannode.style.backgroundColor = "yellow";
                middlebit = node.splitText(pos);
                endbit = middlebit.splitText(len);
                middleclone = middlebit.cloneNode(true);
                spannode.appendChild(middleclone);
                middlebit.parentNode.replaceChild(spannode, middlebit);
                skip = 1;
            }
        } else if (node.nodeType == 1 && node.childNodes && node.tagName.toUpperCase() != "SCRIPT" && node.tagName.toUpperCase != "STYLE") {
            for (var child = 0; child < node.childNodes.length; ++child) {
                child = child + searchWithinNode(node.childNodes[child], te, len);
            }
        }
        return skip;
    }
    searchWithinNode(document.body, text, text.length);
}

直接將底下拖曳到書籤(或加到我的最愛)即可使用

 Case Sensitive Find

Click the bookmarklet link in the bookmarks toolbar, type any word or phrase that you are looking for and the bookmarklet will highlight in yellow all the occurrences of that string while matching the case as well. You can click the bookmarklet again to perform another search.
via: http://www.labnol.org/internet/case-sensitive-find/28186/

留言

本月最夯

偷用電腦,怎知?事件檢視器全記錄!(開機時間、啟動項時間...)

楓之谷洋蔥4.1.2 - 最後更新日期04/03