为了给网站访客提供更精确的内容，在规划网站前端页面内容时，有时需要针对不同地域的用户，显示不同的内容。

通过后端的程序语言（如php）结合已保存的ip地址库进行判断来实现是一种方案，但在用户访问量比较大的情况下，针对每个访客的ip分别进行逻辑判断，再将内容输出至前端页面，会对服务器造成较大的压力，且效率比较低下，也不利于实现网站前端页面的静态化。

另一种解决方案是在前端通过js来进行判断，控制页面内容的显示隐藏，来实现这种效果。方法如下：

1，引入第三方ip地址库，这里以搜狐提供的api为例：

<script src="http://pv.sohu.com/cityjson" type="text/javascript"></script>

2,引入之后，会返回一个变量，显示客户端用户的外网ip以及区域编号，如下所示

var returnCitySN = {"cip": "1**.6*.***.3", "cid": "410100", "cname": "河南省郑州市"};

3，通过返回的变量内容，利用js进行判断，控制内容的显示，例如：如果客户端用户是来自河南省，则显示“<div id="area">这里的内容分区域显示</div>”这块内容。

<script>
        if((returnCitySN.cid).substr(0,3) == "410"){
            $("#area").show();
        }
</script>

注意：因为是在前端控制，所以在读取内容时，需要将所有区域的内容都读取出来，然后默认隐藏。所以这种方案只适合在被控制区域的内容较少的情况下进行。