V2EX = way to explore V2EX 是一个关于分享和探索的地方
Sign Up Now For Existing Member Sign In
请不要在回答技术问题时复制粘贴 AI 生成的内容
This topic created in 3212 days ago, the information mentioned may be changed or developed.
要求
获取当前页面已 Fork 的成员列表，存储在数组。代码短，耗时少者更佳。返回数组长度应该是 1000。 地址
https://github.com/facebook/react/network/members
示例代码
// 时间和函数长度统计 function timeAndLengthCount(callback){ const timeStart = new Date().getTime() callback() const timeEnd = new Date().getTime() console.log('Time: ' + (timeEnd-timeStart) + 'ms') console.log('Len: '+ callback.toString().length) } // 执行输出 Fork 成员列表的函数 // Time: 7ms // Len: 223 timeAndLengthCount(()=>{ const forkedMenber = document.querySelectorAll('.repo > a:nth-child(odd)'); const forkedMenberList = []; [].forEach.call(forkedMenber, z => forkedMenberList.push(z.innerHTML)); console.log(forkedMenberList); }) 接下来就是开始你的表演了
 | 1 nino Jul 11, 2017  1 [...document.querySelectorAll('#network .repo > a:first-of-type')].map(el => el.textContent) |
 | 2 voidcomma Jul 11, 2017 via iPhone 1 把 querySelectorAll 换成 getElementsBy...会变快。 |
 | 3 zjsxwc Jul 11, 2017 1 剩下的就是 css 选择器的花式写法了 |
 | 5 bw2 OP @xiaojie668329 确实，然后使用正则？ |
 | 8 Wangxf Jul 11, 2017 1 [...document.querySelectorAll('.repo')].slice(1).map((item)=>item.children[2].innerHTML) |
 | 9 crs0910 Jul 11, 2017 1 document.querySelector('#network').textContent.replace(/\s/g, '').split('/react') |
 | 12 hueo Jul 11, 2017 1 要考虑性能的话正则是最快的。 不过昨天的代码是这样的： Array.from(document.querySelectorAll('#network .repo > img + a'), e => e.href) |
| 13 crs0910 Jul 11, 2017 加个 shift 不就得了，我测是 1ms |
| 14 crs0910 Jul 11, 2017 @xiaojie668329 貌似 querySelector\querySelectorAll 都比 getElementById\getElementsByTag 要快，我是最新的 Chrome. https://jsperf.com/getelementsbytagname-a-0-vs-queryselector-a/4 |
| 17 Wangxf Jul 11, 2017 [...document.getElementById('network').getElementsByTagName('a')].filter((item,index)=>index%2===0).map((item)=>item.innerHTML).slice(1); |
| 18 crs0910 Jul 11, 2017 @bw2 document.getElementById('network').textContent.replace(/\s/g, '').split('/react').slice(1)) document.getElementById('network').textContent.replace(/\s/g, '').split('/react').splice(1)) |
| 19 Wangxf Jul 11, 2017 最新版 1.5s [...document.getElementById('network').querySelectorAll('a:nth-child(odd)')].slice(1).map((item)=>item.innerHTML) |
| 20 crs0910 Jul 11, 2017 1 去掉一个 replace 的版本 document.querySelector('#network').textContent.split(/\s*\/\s*react\s*/g).splice(1) |
 | 21 colorwin Jul 11, 2017 你们的电脑的真好....我的古董机跑你们的代码要慢 5s 以上... |
 | 22 iiji86 Jul 11, 2017 1 [...document.querySelectorAll('img+a')].map(_=>_.text) |
| 23 colorwin Jul 11, 2017 同时也很不稳定啊, 同一段代码最慢有 24, 快的有 11 |
 | 24 ctsed Jul 11, 2017 1 network.innerHTML.match(/@[^"]*/g).join().split('@').slice(2) 5ms 61 [...network.querySelectorAll('img+a')].map(_=>_.text) 1ms 53 |
| 25 bw2 OP 厉害了，最新记录是 @crs0910 Time: 1ms Len: 87 document.querySelector('#network').textContent.split(/\s*\/\s*react\s*/g).splice(1) |
 | 30 xAI Jul 11, 2017 1 [...document.querySelectorAll('.network-tree ~ a:not(:last-child)')].map(el=>el.text) |
| 31 ctsed Jul 11, 2017 network.innerText.split(/\s*\/\s*react\s*/g).splice(1) 2ms 50 |
| 32 ctsed Jul 11, 2017 network.innerText.split(/ \/ react\s*/g).splice(1) 48  |
| 33 ctsed Jul 11, 2017 1 其实控制台用$$也可以 [...$$('img+a')].map(_=>_.text) |
 | 34 cain Jul 11, 2017 2 时间统计可以用 window.performance.now() 代替获取时间的方法 |
| 36 bw2 OP @ctsed 请问为什么输入 network 可以直接访问到对应的节点，输入 start-of-content 却访问不到 id 为 start-of-content 的节点 |
 | 39 simo Jul 11, 2017 看完回复，再也不想干前端了 |
| 44 crs0910 Jul 11, 2017 innerText 需要判断 layout，会有额外的性能损耗 |
 | 45 tgxh Jul 11, 2017 1 $$('.repo > a:not(:last-child)').map(el => el.textContent) |
| 46 colorwin Jul 12, 2017 @bw2 老古董, 升不动了. 靠 Linux 强行续命. 习惯了 Ubuntu 之后, 现在有点犹豫要不要买 Mac 了. 感觉相比下 Mac 性价比好低... |
 | 47 O3YwA1ENkb7i35XJ Jul 12, 2017 4 @crs0910 你最后发的代码 ``` document.querySelector('#network').textContent.split(/\s*\/\s*react\s*/g).splice(1) ``` 长度是对了, 但得到的 用户名不正确. 因为后面有一些 repo 的名字是 react-1, react-tap-event-plugin .... 而你的正则上面直接按 react 来分隔, 会导致 -1 , -tap-event-plugin 成为 后面用户名的一部分. 另外还有一个 repo 的名字是 facebook-react 所以正则需要再更新一下, 否则, 即便匹配出来了, 结果是 1000, 但得到的用户名是不正确的, 且数组的最后一个元素是空的, 也是错的. 更新后的代码如下: network.innerText.split(/ \/ \S+\s+/g).slice(1, -1) @ctsed 您的回复也存在同样的问题 |
Select Language