html位置发生变化监听,html监听 --- 监听html文档结构变化
/*config属性
childList:子元素的变动
attributes:属性的变动
characterData:节点内容或节点文本的变动
subtree:所有下属节点(包括子节点和子节点的子节点)的变动
attributeFilter: 监听制定属性[attrName]
record属性
type:观察的变动类型(attribute、characterData或者childList)。
target:发生变动的DOM对象。
addedNodes:新增的DOM对象。
removeNodes:删除的DOM对象。
previousSibling:前一个同级的DOM对象,如果没有则返回null。
nextSibling:下一个同级的DOM对象,如果没有就返回null。
attributeName:发生变动的属性。如果设置了attributeFilter,则只返回预先指定的属性。
oldValue:变动前的值。这个属性只对attribute和characterData变动有效,如果发生childList变动,则返回null。
observer.disconnect(); //停止监听观察
observer.takeRecord(); //清除历史监听记录*/
functionmonitor(id,method){
let MutationObserver= window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;//浏览器兼容
let config = { attributes: true, childList: true,subtree:true}//配置对象
$(`#${id}`).each(function(){
let _this= $(this);
let observer= new MutationObserver(function(mutations) {//构造函数回调
mutations.forEach(function(record) {
window[method].call(this);
});
});
observer.observe(_this[0], config);
});
}
functionMysubmenu(){if(record.type == ‘childList’){//监听结构发生变化
if($(record.target).find(‘#exam_theory_organize’).length>0){//studentId: “4”, mark: “student_online”
if(webSocketData.mark ==”student_online”){
$(‘#select_student’).bootstrapTable(“refresh”);
}else if(webSocketData.mark ==”ready_exam”){//let selectStudentData = $(‘#select_student’).bootstrapTable(“getData”);
//$.each(selectStudentData,function(i,v){if(v.USER_ID == webSocketData.studentId){ v.exam_stauts =’已就绪’} })
$(‘#select_examPaper’).bootstrapTable(“refresh”);
}
}if($(record.target).find(‘#exam_theory_join’).length>0){if(webSocketData.mark ==”grant_exam”){ selectExam();
}else if(webSocketData.mark ==”strat_exam”){ }
}
}
}
还没有评论,来说两句吧...