教学评估？别烦，看这！_教学评估脚本-CSDN博客

本文链接：https://blog.csdn.net/xxKarina/article/details/78787550

本文属xxKarina原创，转载请注明
个人博客地址：
https://xxkarina.github.io/

需求

作为学生，总会在学期末的时候被要求教学质量评测，但是又是考试季的，老师又是在心目中都是A的，却要一个个的去选，实在有点无奈
很多时候我们会想着如果在打开浏览器的时候就可以顺便把教学评估这活给干了不是很好吗？
那既然存在这样的需求，肯定就会有相应的解决方式

常用的解决方式有两种：软件，脚本

今天咱们就来瞧瞧脚本评估是怎么实现的

解决方法

js脚本

为了不掉胃口，我这里决定先给出代码，想要了解的童鞋，可以继续忘下看哦

(function(){
            var n = 0;
            function evaluate() {
                var iframe = window.top.document.getElementById('iframeautoheight').contentWindow;
                var obj = iframe.document;
                var length = obj.getElementById('pjkc').getElementsByTagName('option').length;
                var select = obj.getElementsByTagName('select');
                for(i=1;i<select.length;i++){
                    select[i].value='A';
                } 
                // select[1].value='B'; //一门课有多个老师的时候可以根据这种歌形式进行变相应的调整
                select[select.length-1].value='B'; 
                obj.getElementById('pjxx').value = '这门课很不错';
                obj.getElementById('Button1').click();
            }
            evaluate();
            window.top.document.getElementById('iframeautoheight').onload = function(){
                var iframe = window.top.document.getElementById('iframeautoheight').contentWindow;
                var length = iframe.document.getElementById('pjkc').getElementsByTagName('option').length;
                if (n < length-1) {
                    evaluate();
                    n++;
                }else {
                    iframe.document.getElementById('Button2').click();
                }
            }
        })()

上面的代码直接放在浏览器的控制台回车执行就可以了

首先要解决一个问题就的知道去了解剖析问题的本身，我们要使用简单的脚本去执行教学评估的话，就要只要教学评估的界面是怎么样的一种架构

打开你的教学评估界面，是不是长这样：

主要的界面就是这样

首先我们进行分析，需要操作的地方有下拉框文本框按钮 ，然后比较好的一点是，整个页面的，下拉框，文本框，按钮都不存在冲突的地方，于是我们就可以大胆的猜想他们的类名相同或者id名类似啦，使用getElements来大胆的进行操作啦

然后按下F2键，打开控制台，查看你要的元素
点击红线指向的地方

你会发现
HTML

原来整个教学评估的界面是一个iframe嵌进去的，既然是这样，我们就需要注意几点地方：

元素的获取——最好是从顶层窗口开始获取，以防多层嵌套
iframe下的属性——可以使用contentWindow和contentDocument(相当于我们平时使用的window和document)

继续往里看：
具体评价项下拉框

这里验证了我们刚开始的猜想，命名的相似性

课程下拉框

可以看到两者是不一样的，在这里我们可以使用两种方式去进行区分：

正则——我们可以使用/^DataGrid1__ctl\d+_JS1$/进行匹配
数组下标——由于整个界面就只有一个不一样的下拉框，于是我们可以在循环获取到的select数组的时候选择从第二个开始进行操作（上面的代码选用的是这种）

得知以上信息之后我们就可以开始初步构建我们的代码了：

进行初始化，获取相应的元素

var iframe = window.top.document.getElementById('iframeautoheight').contentWindow;
var obj = iframe.document;
var length = obj.getElementById('pjkc').getElementsByTagName('option').length;
var select = obj.getElementsByTagName('select');

注意：这里都是使用了window.top就是为了防止获取不到元素的情况

获取到相应的元素之后，就可以循环的对元素进行赋值，由于select元素的第一个是课程名称，于是我们从第二个元素（下标为1）开始循环

for(i=1;i<select.length;i++){
  select[i].value='A';
}

又因为不能全部相同，于是我们随机设置一个为B（这里选择的是最后一个）当一门课有多个老师的情况下，这个地方就需要进行相应的调整哦

 select[select.length-1].value='B';

最后就是编辑我们的建议啦
编辑建议

可以看到这里使用的是 textarea所以我们可以使用value来进行赋值

obj.getElementById('pjxx').value = '这门课很不错';

编辑完之后自然是触发保存按钮啦

obj.getElementById('Button1').click();

于是我们就完成了一个单独页面的评估，这里需要注意的一点是，当评价无误点击保存按钮之后，iframe页面会自动刷新加载新的数据，并且会自动切换到下一门课程，于是这部分的功能我们就不需要写了

所以我们要想的就是：在加载页面的时候，再次执行刚才那部分代码，这里我们就可以使用到 onload函数，将之前的代码放在一个函数里evaluate于是就可以在onload的时候进行调用

window.top.document.getElementById('iframeautoheight').onload = function(){
  var iframe = window.top.document.getElementById('iframeautoheight').contentWindow;
  var length = iframe.document.getElementById('pjkc').getElementsByTagName('option').length;
    if (n < length-1) {
         evaluate();
         n++;
    }else {                       
  iframe.document.getElementById('Button2').click();
     }
 }