网页脚本 002：简单脚本实现笔趣阁下载功能

网页结构

<div id="mlfy_main_text">
    <h1>第一章 凉了，要被吃了？（1 / 1）</h1>
    <dt class="tp"></dt>
    <dt class="kw"></dt>

    <div id="TextContent" class="read-content"><p> “呜哇、呜哇、呜哇！”有气无力的哭声在四面透风窄小的房间中回荡。
</p><p> 一名女子紧紧的搂抱着怀中的孩子，用近乎已经可以算是破棉絮的被子为孩子抵挡着从门窗渗入的寒风。
</p><p> 房间内很昏暗，一如那阴暗的气氛。一盏油灯似乎随时都有可能熄灭。
</p><p> “呜哇、呜哇、呜哇！”唐三再次试图发出声音，但发出的也只能是这最基础的哭声。
</p><p> 来到这个世界有几天了，是的，只有几天。他刚刚出生，也就是三天的样子。可他却已经感受到了深深的不妙。
</p><p> 身为曾经的一代神王，为了去追寻自己转世的妻子，他放弃了一切。总算在神识快要熄灭之前接收到了一丝感应，于是，他来到了这个世界。
</p><p> 无论曾经的他有多么强大，可同样是重生了的他，现在也只是一个婴孩儿罢了。最宝贵的是前世的记忆，最可悲的是记忆再强大也改变不了他这脆弱而纤细的小小身躯。
</p><p> 出生三天，吃着这个世界母亲贫瘠的奶水，他现在甚至还没法听懂这个世界的语言。毕竟，这也需要时间。可他却明显感觉到，自己重生到的这个世界中，恐怕比想象中还要艰难。
</p><p> 前世的他，怎么说也是出生在一个铁匠家庭，而且自己的父亲还是隐藏的一代强者，甚至自己也拥有着强大的天赋。可现在的他，最大的担忧却是自己能不能活下去。
</p><p> 长途的宇宙寻找，令他的神识只能是勉强承载住记忆，除此之外，根本什么都做不了。可他也能感受到，自己这小小身躯是何等的凄惨。
</p><p> 自己这位母亲，长期缺乏营养的缘故，导致自己这重生的身体，也是绝对意义上的营养不良。甚至连哭声都很微弱。
</p><p> 前世的他，也是有孩子的人，正常孩子应该怎么哭他还是知道的啊！可现在的自己，却连哭都费劲。似乎随时都有可能要断气似的。
</p><p> 虽然他从未想过自己会重生到一个含着金汤匙的家庭，却也没想到会这么惨。神王重生，随时要死，那岂不是一切就结束了？写小说都用不了一章就全剧终了？
</p><p> 不过，在这短暂的三天时间内，他还是感受到了一些东西。对这个世界有着些许的了解。之所以感受到自己的处境不妙，和这份了解也有很重要的关系。
</p><p> 他重生的还是人类，至少是和自己曾经那个世界相差无几的人类。可是，在这个世界上，人类似乎是非常卑微的存在，简单来说就是，奴隶！是作为高等种族的奴隶。所以才会这
</p><p> 么凄惨。
</p><p> 三天了，他没见过自己在这个世界上的父亲，就只是和自己这位母亲相依为命。每天会有衣衫褴褛的其他人类，悄悄的送一点吃的过来给自己这位母亲，这才能维持着他们的生存。
</p><p> 每个人的表情都很木然，或者说是麻木。似乎对于眼前的境遇他们早就已经习以为常了。
</p><p> 唐三毕竟是有前世记忆的，神识也会让他在这个世界的神魂比正常人强大一些。而他之所以还没有学会这个世界的语言，最重要的原因是，这些人类都很少说话、交流。就算是说话，也就是简单地几个字。
</p><p> 自己这不会是凉了吧？唐三嘴角抽搐了一下，忍不住又“呜哇、呜哇”的哭了两声。
</p><p> 小舞，你要是转世有灵，一定要保佑你的老公啊！别的不说，先保佑你的老公能活下去。不然我们就真的无法再一家团聚了。
</p><p> 身体的虚弱让他不知不觉间又沉沉的睡了过去。而这样浑浑噩噩的日子，整整过了一个月。
</p><p> 每天吃着母亲的一点点奶水，总算是没饿死。但小小身躯的虚弱自然还是毫无疑问的。以唐三对自己身体的感知，那脆弱的小经脉啊！那弱小的身躯啊！这都快一个月了，自己的体重恐怕也就是五、六斤的样子，跟前世正常的、刚出生的婴儿差不多。
</p><p> “砰！”脆弱的房门突然开启，这还是唐三在来到这个世界上听到的最大的一次声音。下意识的睁开眼睛看去。
</p><p> 一个身材雄壮的家伙从房门处钻了进来，看到他的样子，唐三不禁有些发呆。
</p><p> 因为这真的不是人类样子。在他曾经的世界，各种怪物也见的多了，但眼前这个绝对是有些新鲜的。钻进来的这个，应该是雄性，类似于人的身躯，身高足有两米开外，却长着一颗狼头。獠牙突出，身上带着淡淡腥气。那强壮的体魄差点把门框都挤破了。
</p><p> “一个月了，给我。”狼人低吼着向唐三这个世界的母亲说道。
</p><p> 唐三的母亲搂紧了他，眼眶中，泪水几乎是瞬间就流了下来。
</p><p> 一个月，唐三也总算能简单的听懂一些这个世界的话了。他这个时候，内心却有种难以言喻的感受。
</p><p> 这狼人要的显然是自己，把自己要过去干嘛？吃么？
</p><p> ————
</p><p> 新书上传，希望大家可以先收藏、推荐，正式连载将于月号。</p></div>
</div>

实现效果

• 图标来自https://flowbite.com/icons/

code

• 这段代码是通过浏览器插件如 Tampermonkey 来执行的。这个脚本的目标是在指定的网页上添加一个按钮，点击该按钮将下载页有 p 元素的文本内容，并保存为一个文本文件。

// ==UserScript==
// @name         BIQUGEDOWNLOAD
// @namespace    http://tampermonkey.net/
// @version      2024-02-18
// @description  try to take over the world!
// @author       FAKEOCCUPATIONAL
// @match        http://170.178.183.148/chapter/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=183.148
// @grant        none
// ==/UserScript==


main();
function addDownloadButton(thename){
    let myButton = document.createElement('button');
    myButton.textContent = 'Click me';
    myButton.classList.add("download");
    myButton.style = 'font-size: 26px; position: fixed; top: 200px; left: 0; z-index: 9999; list-style: none; border: 1px red solid; border-radius: 10px;background-color: #00ccff; padding:5px';
    myButton.innerHTML ='<svg  width="18" height="18" class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M20 10H4v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8ZM9 13v-1h6v1c0 .6-.4 1-1 1h-4a1 1 0 0 1-1-1Z" clip-rule="evenodd"/><path d="M2 6c0-1.1.9-2 2-2h16a2 2 0 1 1 0 4H4a2 2 0 0 1-2-2Z"/></svg>'
    myButton.addEventListener("mouseover", function() {
        myButton.innerHTML ="DOWN LOAD SUBTITLE";
    });

    myButton.addEventListener("mouseout", function() {
        myButton.innerHTML ='<svg  width="18" height="18" class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M20 10H4v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8ZM9 13v-1h6v1c0 .6-.4 1-1 1h-4a1 1 0 0 1-1-1Z" clip-rule="evenodd"/><path d="M2 6c0-1.1.9-2 2-2h16a2 2 0 1 1 0 4H4a2 2 0 0 1-2-2Z"/></svg>'
    });
    myButton.addEventListener('click',() => {
        console.log("]]]]]]]]]]]]]]]]",thename,JSON.stringify(thename) );
        myshowTranscript(thename);
    })
    document.body.appendChild(myButton);
}

async function myshowTranscript(thename) {
    console.log("myshowTranscript", thename);
    var mytext = [];
    // 获取包含所有 
 元素的节点列表
    var paragraphs = document.getElementById("TextContent").getElementsByTagName("p");

    // 遍历节点列表并打印每个 
 元素的 TextContent
    for (var i = 0; i < paragraphs.length; i++) {
        console.log(paragraphs[i].textContent);
        mytext.push(paragraphs[i].textContent+"\n")
    }
    var blob = new Blob(mytext, { type: 'text/plain' });
    var link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = thename+ '.txt';
    document.body.appendChild(link);
    link.click();// Trigger a click event on the link to initiate the download
    document.body.removeChild(link);
}


function main(){
    var h1Element = document.querySelector("#mlfy_main_text h1");

    // 打印 h1 元素的文本内容
    console.log(h1Element.textContent);
    addDownloadButton(h1Element.textContent);
}

CG

• 笔趣阁小说朗读
• 笔趣阁