Hellorf Extend

输入编号(多个编号以英文逗号","分割)
换行
// ==UserScript==
// @name         Hellorf Extend
// @namespace    使用图片编号在hellorf获取标题并生成excel表格
// @version      2.0
// @description  输入编号(多个编号以英文逗号","分割)
// @author       Yuzu
// @match        https://*.hellorf.com/*
// @icon         https://tse1-mm.cn.bing.net/th/id/R-C.f732f32bdda55fbe0757bbcd22e2645f?rik=JiXn9hkSYwD0Bw&riu=http%3a%2f%2fwx1.sinaimg.cn%2fbmiddle%2fbf4d90e8gy1ghc7tzufofj207v07d755.jpg
// @grant        none
// @connect      *
// @require      https://cdn.bootcdn.net/ajax/libs/clipboard.js/2.0.11/clipboard.js
// @require      https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.core.min.js
// @license      Ookinayuzu



// ==/UserScript==

//类
class message {
    constructor(number, title) {
        this.number = number;
        this.title = title;
    }
}
window.hasZh= function(str){//判断字符串是否有中文
    for(var i = 0;i < str.length; i++)
    {
        if(str.charCodeAt(i) > 255){ //如果是汉字，则字符串长度加2
            return true;}
        return false;
    }
}

window.get_lastchild = function (n)
{
    var x=n.lastChild;
    while (x.nodeType!=1)
    {
        x=x.previousSibling;
    }
    return x;
}

window.myDisplayer= function() {
    'use strict';
    let num = document.getElementById("number").value;
    document.getElementById("num1").innerHTML = num;
}

window.getURL = function() {
    'use strict';
    let num = document.getElementById("number").value;
    var url = "https://www.hellorf.com/image/show/" + num;
    /*console.log(url);*/
    //myDisplayer(num);
    return url;
}

window.myDisplayer= function() {
    'use strict';
    let num = document.getElementById("number").value;
    document.getElementById("num1").innerHTML = num;
}
window.openFile = function(event) {//读取txt
    var input = event.target;
    window.XLSX = XLSX
    var reader = new FileReader();
    let files = event.target.files;
    let file = files[0];
    reader.readAsBinaryString(file);
    reader.onload = function(e) { //处理load事件。读取操作完成时触发。
        let data = e.target.result;
        let workbook = XLSX.read(data, {type: 'binary'}); //XLSX：/xlsx.core.min.js 通过XLSX.read(data, {type: type})方法读取excel 后面介绍
        console.log(workbook );
        let sheetNames = workbook.SheetNames; // 工作表名称集合
        let worksheet = workbook.Sheets[sheetNames[0]]; // 这里我们只读取第一张sheet
        let txt = XLSX.utils.sheet_to_txt(worksheet); //  读取workbook  这里可以自己写方法输出表格 这里建议使用XLSX.utils.工具类输出数据   这里以json格式输出数据 还有其他格式 代码后介绍
        console.log(txt);
        var a = txt;


        var num= a.replace(/[\u4e00-\u9fa5]|[a-zA-Z]/g, "");

        num = num.trim();
        num = num.replace(/[\s+\r+\n+]/g+",");
        num = num.replace(/[^0-9]/ig,",");

        num = num.replaceAll(",,,",",");




         //num= num.replace("xxx", ",");
        console.log(num);
        //console.log(arr1);
        var number = document.getElementById("number");
         number.value = num;
        if(typeof(callback) == "function") callback(json); //回调
        document.getElementById('readLocalFile').value = null; //读取后清空
    };
};


window.newChart = function(){
    // 获取输入的值（即input中的value值）
    //var id = document.getElementById("id").value;
    //console.log("new chart");
    var id=1;
    var num2 = document.getElementById("num1").value;
    //console.log(num2);
    var title2 = document.getElementsByClassName("col3").innerHTML;
    //console.log(title2);

    // 改变原本得到的数据格式为textNode格式
    id = document.createTextNode(id);
    num2 = document.createTextNode(num2);//console.log(num2);
    title2 = document.createTextNode(title2);
    //console.log(title2);

    // 创建tr（创建行）
    var tr = document.createElement("tr");
    // 创建td，并赋于class和值（创建单元格，并输入值）
    var td1 = document.createElement("td");
    td1.className = "col1";
    td1.appendChild(id);
    var td2 = document.createElement("td");
    td2.className = "col2";
    td2.innerText= num2;
    td2.appendChild(num2);
    var td3 = document.createElement("td");
    td3.className = "col3";td3.innerText= col3.innerHTML;
    td3.appendChild(title2);

    // 创建input，并设置按键反应（编辑、删除 按钮）


    // 获取table1
    var table = document.getElementById("table1");
    // 将tr加入table中
    table.appendChild(tr);
    // 将td依次加入tr中
    tr.appendChild(td1);
    // tr.appendChild(idTd);
    tr.appendChild(td2);
    tr.appendChild(td3);

}


//css
var mainDiv ='<style type="text/css"> html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 10px; } ';
mainDiv += 'table { border-collapse: collapse; border-spacing: 0; margin:15px;width:90%;font-size:13px} .tableTitle{background-color:lightskyblue;font-weight: bold;} td, th { padding: 0; } .pure-table { border-collapse: collapse; border-spacing: 0; empty-cells: show; border: 1px solid #cbcbcb; } .pure-table caption { color: #000; font: italic 85%/1 arial, sans-serif; padding: 1em 0; text-align: center; } .pure-table td, .pure-table th { border-left: 1px solid #cbcbcb; border-width: 0 0 0 1px; font-size: inherit; margin: 0; overflow: visible; padding: 0.5em 1em; }';
mainDiv+=' .pure-table thead { background-color: #e0e0e0; color: #000; text-align: left; vertical-align: bottom; } .pure-table-bordered td { border-bottom: 1px solid #cbcbcb; } .pure-table-bordered tbody > tr:last-child > td { border-bottom-width: 0; }';
mainDiv += ' #col1{ font-weight: bold;} input#clip{margin : 15px;}input#btnClose { float: right; margin: 10px; padding: 3px 6px; }div#inputPlac2 { margin: 15px; width: 100%; align-items: center; } input#number {overflow:scroll;width: 80%;margin:10px} #keywords{margin: 10px 10px 10px 10px;width: 76%;}div#inputPlac{margin: 15px;width: 100%;align-items: center;} #main1 {overflow-x:auto;overflow-y:auto;right:10%;box-shadow: 1px 1px 20px #000000; z-index: 99999; text-align: left; border: 3px solid green; margin: 0px auto; width: 80%; height: 80%; position: fixed; top: 100px; background-color: white; align-items: center; justify-content: center; } ';
mainDiv += '.markdown-body .highlight pre, .markdown-body pre { padding: 16px; overflow: auto; font-size: 85%; line-height: 1.45; background-color: var(--color-canvas-subtle); border-radius: 6px; } * { box-sizing: border-box; } .btn { position: relative; display: inline-block; padding: 5px 16px; font-size: 14px; font-weight: 500; line-height: 20px; white-space: nowrap; vertical-align: middle; cursor: pointer; -webkit-user-select: none; user-select: none; border: 1px solid; border-radius: 6px; -webkit-appearance: none; appearance: none; } .ClipboardButton { position: relative; } .btn { color: var(--color-btn-text); background-color: var(--color-btn-bg); border-color: var(--color-btn-border); box-shadow: var(--color-btn-shadow),var(--color-btn-inset-shadow); transition: 80ms cubic-bezier(0.33, 1, 0.68, 1); transition-property: color,background-color,box-shadow,border-color; }';
mainDiv +='</style>';
//mainDiv += '$color-gray: #666; $color-black: #000; $stripe-height: 6px; $btn-color: $color-gray; $btn-background: #fff; $btn-color-hover: #fff; $btn-background-hover: $color-gray; $border-color: $color-gray; $border-color-hover: $color-black; @mixin reset-button { overflow: visible; margin: 0; padding: 0; border: 0; background: transparent; font: inherit; line-height: normal; cursor: pointer; -moz-user-select: text; &:-moz-focus-inner { padding: 0; border: 0; } } @keyframes stripe-slide { 0% { background-position: 0% 0; } 100% { background-position: 100% 0; } } body { width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; flex-direction: column; font-family: sans-serif; } .btn {@include reset-button; z-index:99999;display: block; text-decoration: none; text-transform: uppercase; padding: 16px 36px 22px; background-color: $btn-background; color: $btn-color; border: 2px solid $border-color; border-radius: 6px; margin-bottom: 16px; transition: all 0.5s ease; &--stripe { overflow: hidden; position: relative; &:after { content:""; display: block; height: $stripe-height; width: 100%; background-image: repeating-linear-gradient( 45deg, $border-color, $border-color 1px, ); -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; left: 0; bottom: 0; background-size: $stripe-height $stripe-height; } &:hover { background-color: $btn-background-hover; color: $btn-color-hover; border-color: $border-color-hover; &:after { background-image: repeating-linear-gradient( 45deg, $btn-color-hover, $btn-color-hover 1px, ); } } } }';


//html
mainDiv +='<div id ="main1"><div><input id="btnClose" class = "btn btn--stripe" type="button" value="X" onClick="custom_close()" />';
//输入框
mainDiv +='<div style="border:3px dot grey;margin:10px;height:70%;width:90%;border-style:double;"><div id = "inputPlac" class = "input">  <span>编号：</span> <input type="text" id="number" name="number" > ';
mainDiv +='<p id="p1"><input type="file" id="readLocalFile" class="fileBtn" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" onchange="openFile(event)" multiple="false" style="display:inline-block"><input type ="button" class ="btn btn--stripe" id ="submit1" value="submit" style="display:inline-block"/></p>';
mainDiv +='</div>';
//输出结果
mainDiv +='</div><button class = "btn btn--stripe" style="margin:10px 10px 0px 15px;display:inline-block;"><a id="toExcel">导出excel</a></button><span id="loading"></span><span id="loading1"></span>';


mainDiv +='<table  class="pure-table pure-table-bordered" id="table1" cellspacing="0px" > <tr class="tableTitle" align="center"> <td class="col1">序号</td> <td class="col2">图片编号</td> <td class="col3">标题</td> </tr> </table></div></div></div>';




//console.log("1");//插入div至html
let div=document.createElement("div");
div.innerHTML = mainDiv;
document.body.append(div);



let script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.src = "https://cdn.bootcdn.net/ajax/libs/clipboard.js/2.0.11/clipboard.js";
document.documentElement.appendChild(script);
//var Clipboard;
(function(){
    var clipboard = new ClipboardJS('.copy');
    clipboard.on('success', function(e) {
        console.log(e);
    });

    clipboard.on('error', function(e) {
        console.log(e);
    });})();

window.custom_close = function (){
    'use strict';
    if(confirm("确定要关闭脚本吗？")){
        window.opener=null;
        window.open('','_self');
        //window.close();
        var a = document.getElementById("main1");
        a.remove("div");
    }
    else{
    }
}

let btn = document.getElementById("submit1");

var col3 = document.getElementsByClassName("col3");
btn.onclick = function(){
    //输入框是否是空的
    var loading1 = document.getElementById("loading1");
    var loading = document.getElementById("loading");

    var num = document.getElementById("number").value; //console.log("num ="+ num);
    if(num.length == 0){
        alert("输入框为空！");

    }else{
        //console.log(3);
        var numArray = num.split(",");//console.log(numArray);
        var i = 0;var url1;var xhr1=[];var urlArray = [];var j=1;
        for(i = 0; i < numArray.length; i++){
            console.log("正在获取第"+i+"个标题的信息");
            $("#loading").text ="正在获取第"+i+"个标题的信息";
            loading.innerHTML = "已获取了"+i+"个标题的信息";
            var c = numArray[i];
            xhr1[i]= new XMLHttpRequest();
            xhr1[i].onreadystatechange = () => {
                urlArray[i] = "https://www.hellorf.com/image/show/"+ numArray[i]
                var col3 = document.getElementsByClassName("col3");
                //console.log(numArray[i]);
                //numArray[i] = document.getElementById("number").value;
                url1 = "https://www.hellorf.com/image/show/"+ numArray[i];

                //console.log("c1="+numArray[i]);
                //console.log("urlArray="+urlArray[i]);
                if (xhr1[i].readyState !== 4) {
                    return;
                }
                if (xhr1[i].readyState == 4 && xhr1[i].status == 200) {
                    var numIndex = numArray.indexOf(numArray[i]);
                    //url1 = "https://www.hellorf.com/image/show/"+ numArray[numIndex];
                    //console.log("??url1="+url1);

                    //console.log(xhr1[i].response);
                    //console.log(xhr1[i].responseXML);
                    /*this.ResponseXML;*/

                    var demo = xhr1[i].responseXML;
                    var a = 1 ;
                    a = demo.getElementsByTagName("title");

                    var b = a[0].innerHTML;
                    var n = b.replace("站酷海洛_正版图片_视频_字体_音乐素材交易平台_站酷旗下品牌", "");
                    //var n = b.split("_");
                    //console.log(n);

                    if(n.length <= 0){
                        j=j-1;
                        console.log("编号"+numArray[i]+"不正确");

                        //numArray.splice(numArray.indexOf(c[i]),1);
                        //console.log("j="+j+"Numarray = "+numArray);
                        //continue;
                    }
                    else {
                        b.indexOf("_");
                        b = b.slice(0,b.indexOf("_"));//console.log(b);
                        //document.getElementById("num1").innerHTML = numArray[i];

                        //document.getElementById("title1").innerHTML = b;
                        //document.getElementsByClassName("col3").innerHTML = b;
                        //title2 = b;




                        // 获取输入的值（即input中的value值）
                        //var id = document.getElementById("id").value;



                        var id= j;
                        //console.log("j="+j);
                        var num2 = numArray[i];
                        //console.log("num2 = "+num2);
                        var title2 = b;
                        // console.log("num2 = "+ title2);


                        // 改变原本得到的数据格式为textNode格式
                        id = document.createTextNode(id);
                        //id.innerHTML= "${vs1.index+1}";
                        num2 = document.createTextNode(num2);
                        //console.log("c2+"+num2);
                        title2 = document.createTextNode(title2);
                        //console.log(title2);

                        // 创建tr（创建行）
                        var tr = document.createElement("tr");
                        // 创建td，并赋于class和值（创建单元格，并输入值）
                        var td1 = document.createElement("td");
                        td1.className = "col1";
                        td1.appendChild(id);

                        var td2 = document.createElement("td");
                        td2.className = "col2";
                        //td2.innerText= num2;
                        td2.appendChild(num2);

                        var td3 = document.createElement("td");
                        td3.className = "col3";
                        //td3.innerText= col3.innerHTML;
                        var x = col3;var autoId = "autoTitleId" + j;
                        var autoIdTarget = "#"+autoId;

                        td3.setAttribute('id', autoId);
                        td3.appendChild(title2);

                        var copyBtn = document.createElement("input");
                        //copyBtn.setAttribute('id', 'clip');
                        copyBtn.setAttribute('class', 'btn copy btn--stripe"');
                        copyBtn.setAttribute('type', 'button');
                        copyBtn.setAttribute('data-clipboard-action', 'copy');
                        copyBtn.setAttribute('data-clipboard-target', autoIdTarget);
                        copyBtn.setAttribute('value', 'Copy');
                        td3.appendChild(copyBtn);
                        //td3.appendChild(copyBtn);copyBtn.innerHTML='<input id = "clip" class = "btn copy" type = "button" data-clipboard-action="copy" data-clipboard-target=autoIdTarget value = "Copy"/>';

                        // 获取table1
                        var table = document.getElementById("table1");
                        // 将tr加入table中
                        table.appendChild(tr);
                        // 将td依次加入tr中
                        tr.appendChild(td1);
                        // tr.appendChild(idTd);
                        tr.appendChild(td2);
                        tr.appendChild(td3); j++;
                        return b;
                    }

                }else {
                    console.log('request error');
                }

            };

            urlArray[i] = "https://www.hellorf.com/image/show/"+ numArray[i];
            //console.log(url1)
            xhr1[i].open("GET", urlArray[i], false);
            /* 如果已指明，responseType 必须是空字符串或 "document"*/
            //xhr1[i].responseType = "document";

            /* overrideMimeType() 用来强制解析 response 为 XML*/
            xhr1[i].overrideMimeType("text/xml");
            xhr1[i].send();

        } //console.log("跳出循环");

    }

}
// var num = document.getElementById("number").value;

var element = document.getElementById("toExcel");
var toExcel = function(event) {//生成excel文件

    // 获得表格数据的html标签和文本d;
    //var html = "<html><head><meta charset='UTF-8'></head><body>"+document.getElementById("table1").outerHTML+"</body></html>";
    // 创建一个Blob对象，第一个参数是文件的数据，第二个参数是文件类型属性对象
    //var blob = new Blob([html],{type:"application/vnd.ms-excel"});
    //var a = event.target;
    // 利用URL的createObjectURL方法为元素a生成blobURL
    //a.href = URL.createObjectURL(blob);
    //console.log(a.href);
    //a.download = "chart";
    // 设置文件名
    window.XLSX = XLSX
    var table1 = document.querySelector("#table1");
    var sheet = XLSX.utils.table_to_book(table1);//将一个table对象转换成一个sheet对象
    XLSX.writeFile(sheet, 'chart.xlsx');
}
element.onclick = toExcel;
欢迎访问Greasy Fork镜像
