RandomNumberGen Posted January 22, 2018 Share Posted January 22, 2018 Hi, I would like to know if it's possible to use javascript (specially on Anki; if you know what it is) to format a text line into a html table. Basically, what I want is to copy the definition of an online dictionary (japanese in this case): 長/long, leader/ながい、おさ/チョウ And have the javascript read the first "/", select what's behind it, put in a <th>, select what's between first and second /, put in a <td>, and so forth. I have the CSS set up already. All of this in real time, like, when the software tries to show the line above, the JS will format it to show the stylized table to me. Is this even possible? Does the w3s guide teach this kind of stuff at some point? Link to comment Share on other sites More sharing options...
niche Posted January 22, 2018 Share Posted January 22, 2018 (edited) Sure. A javascript function could easily handle that. EDIT: the function could have a https://www.w3schools.com/jsref/jsref_match.asp and a https://www.w3schools.com/jsref/jsref_match.asp Edited January 22, 2018 by niche Link to comment Share on other sites More sharing options...
RandomNumberGen Posted January 22, 2018 Author Share Posted January 22, 2018 Awesome. I just tested basic JS on AnkiDroid and it works! Time to relearn all of this. Do you know if a function that selects stuff is part of basic JS or it's one of those you have to attach extra code on the header? Link to comment Share on other sites More sharing options...
Ingolme Posted January 22, 2018 Share Posted January 22, 2018 Everything in the W3Schools Javascript reference is native JS and not code from a library. Link to comment Share on other sites More sharing options...
RandomNumberGen Posted January 23, 2018 Author Share Posted January 23, 2018 (edited) Cool, I did it. <!DOCTYPE html> <html> <style> .tk { border-collapse: collapse; } .tk th, td { border: 1px solid #ddd; padding: 6px } .tk th { width: 56px; background-color: #f7f7f7; font-size: 24px; font-weight: normal; } .tk td { width: 240px; text-align: left; font-size: 16px; } </style> <body onload="kanjiFormat()"> <p id="jisho">#長#long, leader#ながい、おさ#チョウ#</p> <script> var codeKstart = '<table align="center" class="tk"><tr><th rowspan="2">' var codeMstart = '</th><td>' var codeRstart = '</td></tr><tr><td>' var codeComma = '、' var codeRend = '</td></tr></table>' function kanjiFormat() { var str = document.getElementById("jisho").innerHTML; var txt = str.replace(/#/, codeKstart).replace(/#/, codeMstart).replace(/#/, codeRstart).replace(/#/, codeComma).replace(/#/, codeRend); document.getElementById("jisho").innerHTML = txt; } </script> </body> </html> Now: - How do I make the search for forward slashes (/)? I replaced them with # for the sake of testing. Nevermind, it will try to replace the forward slashes from html as well. Gotta replace them with another symbol when I paste it. - Also, sometimes there one less category (e.g. /電/electricity/デン), in that case I wouldn't need the comma var. Where do I put an if in this function? Edited January 23, 2018 by RandomNumberGen Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now