浏览器检测

1.自定义Vue框架中原生JS中浏览器检测

var isSystemBrowserVersion = function () {
		var agent = navigator.userAgent.toLowerCase(),
			regStr_chrome = /chrome\/[\d.]+/gi,
			chromeVersion = '',
			chromeArr = agent.match(regStr_chrome);
		if (chromeArr) {
			chromeVersion = chromeArr[0];
			if (chromeVersion) {
				try {
					var arr1 = chromeVersion.split('/'),
						arr1Val1 = arr1[1],
						arr2 = arr1Val1.split('.'),
						arr2Val1 = arr2[0];

					ret`urn arr2Val1 && N`umber(arr2Val1);
				} catch (error) {
					return false;
				}
			}
		} else {
			return false;
		}
	},
	
		returnComString = function (val) {
			return str = ' <div class="mask">' +
				'<div class="imgDiv">' +
				'<img src="/cicsstax/src/images/icon_warning1.png" alt="" class="img">' +
				'</div>' +
				'<p>该系统需在谷歌浏览器55以上版本使用，请下载</p>' +
				'<div class="button">' +
				'<a class="left"' + 'οnclick="cancle(' + val + ')">取消</a>' +
				'<a href=' + path + '/file/downloadSoftware?name=chrome64' + ' class="right"' + '>下载</a>' +
				'</div>' +
				'</div>';
		},
		renderBrowser = function () {
			var version = isSystemBrowserVersion(),
				downPageDom = document.getElementById('downBrowserContentId'),
				appDom = document.getElementById('app'),
				str = '';
				
			if (version) {
				if (version < 55) {
					str = returnComString(version);
					downPageDom.style.display = 'block';
					downPageDom.style.backgroundColor = '#1f2021';
					appDom.style.display = "none";
					downPageDom.innerHTML = str;
				} else if (version >= 55 && version < 79 || version > 79) {
					appDom.style.display = "none";
					str = returnComString(version);
					downPageDom.style.display = 'block';
					downPageDom.style.backgroundColor = '#1f2021';
					downPageDom.innerHTML = str;
					console.log(appDom,downPageDom);
				} else {
					document.body.removeChild(downPageDom);
					appDom.style.display = 'block';
				}

			} else {
				str = ' <div class="mask">' +
					'<div class="imgDiv">' +
					'<img src="/cicsstax/src/images/icon_warning1.png" alt="" class="img">' +
					'</div>' +
					'<p>该系统需在谷歌浏览器55以上版本使用，请下载</p>' +
					'<div class="down">' +
			
					+
					'</div>' +
					'</div>';
				downPageDom.style.display = 'block';
				downPageDom.style.backgroundColor = '#1f2021';
				document.body.removeChild(appDom);
				downPageDom.innerHTML = str;
			}
		},


	window.cancle = function (v) {
		var downPageDom = document.getElementById('downBrowserContentId'),
		appDom = document.getElementById('app');
		console.log(v,appDom,downPageDom);
		var version = Number(v);
		if (version < 55) {
			window.location.href = "www.baidu.com";
		} else if(version >= 55 && version < 79 || version > 79) {
			downPageDom.style.display="none";
			appDom.style.display="block";
			console.log(appDom,downPageDom);
		
		}
	};

自定义Vue项目中，最开始使用两个获取DOM节点。在JS操作DOM节点时，第一次修改DOM节点中的属性发生改变。但是当我们在事件中使用DOM节点来进行操作的时，此时使用的DOM节点不是这个第一修改后的DOM节点而是之前的未修改的那个DOM节点。
总结自身问题：打印时查看节点时没有打印完全，没有对比几者之间的差距。