使用js的方式打开链接

一般情况下使用标签方式打开

<a href="http://www.baidu.com">open Link</a>

使用js打开链接的几种方式

1. 使用window.open() 方法打开一个定制好的页面，包括页面的大小以及位置等等

var oBtn = document.getElementsByClassName('btn')[0];
	oBtn.onclick = function(){
		window.open(
			'http://www.baidu.com',
			'百度一下',
			'_blank'
		)
	}

2. 使用location.href 方式打开页面

	<button class="btn">open Link</button>
	<script>
		var oBtn = document.getElementsByClassName('btn')[0];
		oBtn.onclick = function(){
			location.href = 'http://www.baidu.com'
		}
	</script>

3. 使用location.assign() 方式打开页面

	<button class="btn">open Link</button>
	<script>
		var oBtn = document.getElementsByClassName('btn')[0];
		oBtn.onclick = function(){
			window.location.assign('http://www.baidu.com')
		}
	</script>

4. 使用location.replace() 方式打开，注意，此方法与之前介绍的方法略有所不同，从字面上理解为替换，也就是说用新的页面替换之前的页面，该方法会导致浏览器的history 失效

<button class="btn">open Link</button>
	<script>
		var oBtn = document.getElementsByClassName('btn')[0];
		oBtn.onclick = function(){
			window.location.replace('http://www.baidu.com')
		}
	</script>

小结:

使用js方式更具灵活性，可以为任何元素绑定跳转功能，但缺乏语言化，不利于搜索引擎抓取，建议使用标签形式打开链接。