Posts

Control CSS using classList

ClassList can help reduce the redundancy of .style method and resolve the ClassName overwrite risk. Sytax: // add a class element.classList.add('className') // delete a class element.classList.remove('className') // switch a class element.classList.toggle('className') Example: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .box { width: 200px; height: 200px; color: #333; } .active { color: red; background-color: pink; } </style> </head> <body> <div class="box">text</div> <script> //get element const box = document.querySelector('.box') //change stylew by adding class box.classList.add('active') // delete class box.classList.remove('active') //switch class box.classList.toggle('active') </script> </body> </html> keep in mind that the running logic of toggle is run the detect if the class existed in the element, if yes, delete, if no, add up ...

DOM -- Document Object Model

DOM query Slect first match element document.querySelector('css selector') Slect all match element document.querySelectorAll('css selector') return is fake array which no work with push and pop method Modification using DOM modify text content <body> <div class="box">content</div> <script> const box = document.querySelector('.box') box.innerText = 'content changed' box.innerHTML = '<strong>content changed</strong>' </script> </body> innerText method will not parse tags, exp: <strong>hello</strong> will return <strong>hello</strong> rather hello

Git classic workflow and merge conflict solution

Mearge conflict resolution: Edit the confilct file manually and then commit to branch

How to enter QNAP NAS Mega CMD

Mega CMD is an software that provide similar function of QNAP HBS, but I don’t know why they can’t just integrated their function into HBS. And it is a command line system, though I’m not afraid of command but it truly increase the inconvenience for those who just want to make a backup. Most seriously, the way to enter the cmd window won’t show up on their readme.md but only in the introduction of the app store, with an very blurry picture. That’s ridiculous. I hope they can make the doc clearer in the future. ...

How to make QNAP NAS DDNS functional while using Tproxy

Prerequisite: Before proceeding, it is essential to have a static public IP. If you do not already have one, kindly reach out to your ISP for assistance. Please note that if you are unfamiliar with QNAP NAS, this article may not cater to your requirements. For several reasons, you cannot connect to many cloud storage server like google drive in China, which make it difficult to fully function the HBS3(Hybrid Backup Sync). To solve those problem, I add a proxy gateway to my family network and make some configuration to make sQure the Transparent proxy working properly. However, this led to troubles with the Dynamic Domain Name System (DDNS) due to the changes in configuration. This issue had persisted for quite some time until I finally discovered the solution to the mystery. ...