V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
imn1
V2EX  ›  JavaScript

想实现一个眼不见为净的功能,求思路

  •  
  •   imn1 · 2015-12-12 14:08:10 +08:00 · 2371 次点击
    这是一个创建于 3079 天前的主题,其中的信息可能已经有所发展或是发生改变。
    最近在写自用的 pentadactyl plugin
    选择页面某个区域块,或依据 xpath ,只保留显示此区域块,其他都隐藏
    至于是否必须 xpath 不是重点,只是我较熟悉 xpath 而已

    现在已知 path 主干上的每个父节点都要保留(否则选择部分也不能显示),所以某些背景或块形状还是存在留白的,但旁支要隐藏
    起初以为逐层父节点处理就可以了,发觉只能解析 /../*,再上一层 /../../就不能解析了(还是我方向错了?)

    求思路
    js 不算太熟, 10 多年前倒写不少,现在已荒弃 10 年,只能一边看 MDN 一边写,所以别人的插件也读不懂
    第 1 条附言  ·  2015-12-12 16:03:02 +08:00
    搞定,原来这么简单,看来我想多了, clone DOM 节点,然后
    body.innerHTML = ele.outerHTML;
    足矣

    pentadactyl 输入命令: :ox 一个需要转义的 xpath ,回车则可
    至于这个插件,发在 kafan ,其他部分(没贴出来)也可以用 css selector ,参看我前面发过的帖子
    有需要就拿去耍吧,无版权,不负责任
    =====================
    function getElementsByXPath(x) {
    let result = content.document.evaluate(x, content.document.documentElement, null, 5, null);
    let res = [], next;
    while (next = result.iterateNext())
    res.push(next);
    return res;
    }

    group.commands.add(
    // Specs
    ['onlyx[path]', 'ox'],

    // Description
    'Show hidden element from xpath. (转义引号、空格等)',

    // Action. What the command does. Always gets 'args'.
    function (args) {
    let xpath = args[0];
    let x = xpath, list, ls;
    if (xpath != "") {
    list = getElementsByXPath(xpath);
    let body = content.document.body;
    let ele = list[0].cloneNode(true);
    // let fc = body.firstChild;
    // list = getElementsByXPath("//*");
    // hideFromPath(list);
    body.innerHTML = ele.outerHTML;
    // content.document.body.appendChild(ele);
    // body.insertBefore(ele,fc);
    // ele.style.display = 'block';
    }
    }
    );
    5 条回复    2015-12-12 23:12:51 +08:00
    GPU
        1
    GPU  
       2015-12-12 16:13:39 +08:00   ❤️ 1
    參考微博的 chrome 插件
    bramblex
        2
    bramblex  
       2015-12-12 21:46:36 +08:00
    话说楼主怎么写 pentadactyl plugin OwO
    imn1
        3
    imn1  
    OP
       2015-12-12 22:07:49 +08:00
    @bramblex
    pentadactdyl 的 plugin 只是 javascript
    bramblex
        4
    bramblex  
       2015-12-12 22:19:06 +08:00
    @imn1

    话说有一个问题, pentadactdyl 官网上的 nightly 的版本怎么从 8 月开始就不更新了?
    imn1
        5
    imn1  
    OP
       2015-12-12 23:12:51 +08:00
    @bramblex
    我又不是作者,怎么知道,可能去研究新 FF 的 API 了
    ff42 还能用,暂时不敢更新到 43
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5685 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 07:23 · PVG 15:23 · LAX 00:23 · JFK 03:23
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.