Use JS to display the current time and automatically refresh and use JS to modify and save the table data

Through these two days of study, it has been possible to use JS to do some simple table additions and deletions. Today's class exercises are mainly in the following two aspects:

Use JS to display the current time and express it in Chinese. This is relatively simple. You only need to get the current time and add the Chinese unit after the unit:

                        var myDate=new Date();

                    var year=myDate.getFullYear();

var month=myDate.getMonth()+1;
var date=myDate.getDate();
var d=myDate.getDay();
var weekday=['Sunday','Month','Tuesday','Wednesday', 'Thursday','Friday','Saturday'];
var h=myDate.getHours();
var m=myDate.getMinutes();
var s=myDate.getSeconds();

         document.getElementById('dd').innerHTML=year+'year'+month+'month'+date+'day'+weekday[d]+h+'hour'+m+'minute'+s+'second';

However, this program can only output a current time and cannot automatically refresh. This uses the setInterval() method to assign a function outside the above code, followed by a setInterval(a, 1000) to achieve automatic refresh. Among them 1000 represents the interval time in ms.

I made additions and deletions to the form yesterday, and today I learned to modify the content of the form. To achieve this effect, it is necessary to wake up and monitor the data of the table, and then click the button to save after modification. temp.addEventListener('dblclick',function(){
    var oldValue=this.innerHTML;
    var inputElement='<input class="edit" type="text" value="'+oldValue+'">';

    this.innerHTML=inputElement;

The above code can be used to implement monitoring, and double-click to become an input box, so that the data can be modified, and then a saved function can be made

function saveEditLine(obj){
            var tr=obj.parentNode.parentNode;
            var allEdit=tr.querySelectorAll('.edit');
            for (i=0;i<allEdit.length;i++){
            var  newValue=allEdit[i].value;
            allEdit[i].parentNode.innerHTML=newValue;
                }

             }

Save the new data with a simple array.

In general, I feel that I can do it by watching videos, but when I actually do it, I will find that there are many things that I may have heard in class before, but this is the first time I use it. I feel that many things are still new, and I can't always put them together What I have learned is very coherent and can only be used according to the idea of ​​the teacher's demonstration, but there are many ways to implement the program, and I can't find the feeling of typing code very well. Next, I need to memorize some basic knowledge. , practice, in order to be further away from your own requirements.

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326071274&siteId=291194637