Get Rel Path
<head> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <style> body * { display: block; font-size: 16px; margin: .5em 0; width: 100%; } p { text-align: center; } </style> <script type="module"> var relPath = (from, to)=>{ var [arryF, arryT] = [from.split('/'), to.split('/')]; var pname = arryT.pop(); var pathT = arryT.join('/'); var path = ''; while(!~pathT.indexOf(arryF.join('/'))) arryF.pop(), path += "../"; var pathA = arryT.slice(arryF.length); if(pathA.length) (path += pathA.join('/') + '/'); return path + pname; }; var f = document.forms.url; [f.from, f.to].forEach(v=>{ v.addEventListener('input', e=>{ f.result.value = relPath(f.from.value, f.to.value); }) }); // default f.from.value = 'http://topia.wdfiles.com/local--code/get-relative-path/1'; f.to.value = 'http://topia.wdfiles.com/local--files/get-relative-path/gradient.png'; f.result.value = relPath(f.from.value, f.to.value); </script> </head> <body> <form name="url"> <b>from:</b> <input type="text" name="from" placeholder="from" /> <b>to:</b> <input type="text" name="to" placeholder="to" /> <p>⇩</p> <b>result:</b> <textarea name="result" readonly placeholder="result"></textarea> </form> </body>
page revision: 0, last edited: 03 Oct 2020 09:56