本文介绍如何使用JavaScript对静态网络配置中的IP地址、子网掩码和网关进行逻辑性校验。通过解析IPv4地址，利用按位与运算计算网络号，验证IP与网关是否处于同一子网。文章提供了完整的JS代码示例，涵盖合法性检查及逻辑匹配判断，适用于前端表单验证或网络配置场景。
IP、子网掩码与网关逻辑校验概述
在进行静态网络地址配置的JavaScript校验时，常见的资料多集中于IP和子网掩码的有效性检查，而缺乏对IP、子网掩码（submask）与网关（gateway）三者之间逻辑关系的判断。为此，本文编写了相关代码，供有类似需求的开发者参考。
网关地址与按位与运算原理
首先普及网关地址的相关知识：
第一点：进行与运算1与1得1,1与0为0,0与0为0。首先把ip和子网掩码展开 10.70.64.223 00001010 .01000110.01000000.11011111 255.255.255。0 111111111.11111111.11111111.00000000 网段就是 00001010 .01000110.01000000.00000000 然后转换成十进制就是：10.70.64.0
第二点核心原则是：IP地址与子网掩码进行按位与运算的结果，必须与网关地址与子网掩码进行按位与运算的结果一致，这意味着它们的主机号部分应当相同。在实现上，我首先使用JavaScript将IP、掩码和网关字符串以‘.’为分隔符拆分为数组，然后逐段进行按位与运算以进行判断。
第三点涉及JavaScript中的按位与运算机制：
表达式result = 【整数1】 & 【整数2】中，&运算符对两个32位表达式的每一位执行按位“与”操作。如果两个对应位均为1，则结果位为1；否则结果为0。
JavaScript实现代码示例
以下是关于IP地址、子网掩码和网关逻辑性判断的JavaScript详细代码分享。
function checkIP(ip)
{
obj=ip;
var exp=/^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
var reg = obj.match(exp);
if(reg==null)
{
return false;//不合法
}
else
{
return true; //合法
}
}
function checkMask(mask)
{
obj=mask;
var exp=/^(254|252|248|240|224|192|128|0)\.0\.0\.0|255\.(254|252|248|240|224|192|128|0)\.0\.0|255\.255\.(254|252|248|240|224|192|128|0)\.0|255\.255\.255\.(254|252|248|240|224|192|128|0)$/;
var reg = obj.match(exp);
if(reg==null)
{
return false; //"非法"
}
else
{
return true; //"合法"
}
}
var static_ip= document.getElementById('static_ip').value;
var static_mask= document.getElementById('static_mask').value;
var static_gw= document.getElementById('static_gw').value;
if (static_ip=='')
{
// $("#static_ip_error").css("display","block");
document.getElementById('static_ip').focus();
return false;
}else if(!checkIP(static_ip))
{
//$("#static_ip_error").css("display","none");
document.getElementById('static_ip').focus();
return false;
}
if(static_mask=='')
{
//$("#static_mask_error").css("display","block");
document.getElementById('static_mask').focus();
return false;
}else if(!checkMask(static_mask))
{
//$("#static_mask_error").css("display","none");
document.getElementById('static_mask').focus();
return false;
}
if(static_gw=='')
{
//$("#static_gw_error").css("display","block");
document.getElementById('static_gw').focus();
return false;
}else if(!checkIP(static_gw))
{
//$("#static_gw_error").css("display","none");
document.getElementById('static_gw').focus();
return false;
}
if(static_ip == static_mask || static_mask == static_gw || static_mask == static_gw)
{
alert('地址输入错误！');
return false; //3个地址不能相同
}
var static_ip_arr = new Array;
var static_mask_arr = new Array;
var static_gw_arr = new Array;
static_ip_arr = static_ip.split(".");
static_mask_arr = static_mask.split(".");
static_gw_arr = static_gw.split(".");
var res0 = parseInt(lan_ip_arr[0]) & parseInt(static_mask_arr[0]);
var res1 = parseInt(lan_ip_arr[1]) & parseInt(static_mask_arr[1]);
var res2 = parseInt(lan_ip_arr[2]) & parseInt(static_mask_arr[2]);
var res3 = parseInt(lan_ip_arr[3]) & parseInt(static_mask_arr[3]);
var res0_gw = parseInt(static_gw_arr[0]) & parseInt(static_mask_arr[0]);
var res1_gw = parseInt(static_gw_arr[1]) & parseInt(static_mask_arr[1]);
var res2_gw = parseInt(static_gw_arr[2]) & parseInt(static_mask_arr[2]);
var res3_gw = parseInt(static_gw_arr[3]) & parseInt(static_mask_arr[3]);
if(res0==res0_gw && res1==res1_gw && res2==res2_gw && res3==res3_gw)
{
}else{
alert('IP地址与子网掩码、网关地址不匹配！');
return false;
}
接下来分享用于验证IP及子网掩码合法性的JavaScript代码。
function checkIP(ip)
{
obj=ip;
var exp=/^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
var reg = obj.match(exp);
if(reg==null)
{
return false;//不合法
}
else
{
return true; //合法
}
}
function checkMask(mask)
{
obj=mask;
var exp=/^(254|252|248|240|224|192|128|0)\.0\.0\.0|255\.(254|252|248|240|224|192|128|0)\.0\.0|255\.255\.(254|252|248|240|224|192|128|0)\.0|255\.255\.255\.(254|252|248|240|224|192|128|0)$/;
var reg = obj.match(exp);
if(reg==null)
{
return false; //"非法"
}
else
{
return true; //"合法"
}
}以上就是本文的全部内容，希望能为读者的学习提供帮助。