前两天工作时遇到一问题,就是模块A显示时,B是一种样式,模块A删除,B是另一种样式。记录下判断节点存在的方法。

先写下html

 <!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge chrome=1" />
<meta name="keyword" content="随机加判断存在" />
<meta name="description" content="" />
<title>判断节点存在</title>
<style type="text/css">
*{margin: 0;padding: 0;}
#box1{width: 100px;height: 100px;background: #c66;margin: 20px auto;text-align: center;color: #fff;line-height: 100px;}
.box2{width: 200px;height: 200px;background: #c60;margin: 0 auto;text-align: center;color: #fff;line-height: 200px;}
.box22{width: 400px;height: 400px;line-height: 400px;}
</style>
</head>
<body> <div class="box2">模块二</div>
<div id="box1">模块一</div>
</body>
</html>

判断id为box1的div是否存在的方法

js方法

if(document.getElementById('box1'))

jquery方法

1.if($('#box1').length>0)

2.if($('#box1')[0])

放到代码里

 <script type="text/javascript">
var number = (1+Math.random()*(8-1)).toFixed(0);
var oBox2=document.getElementsByTagName('div')[0];
var oBox1=document.getElementById('box1');
if(number<3){
document.body.removeChild(oBox1);
}
if(document.getElementById('box1')){
oBox2.className=oBox2.className+' box22';
console.log(111);
}
else{
oBox2.className='box2';
}
</script>

jquery方法

 <script src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
var number = (1+Math.random()*(8-1)).toFixed(0);
if(number>3){
}
else{
$('#box1').remove();
}
if($('#box1').length>0){//判断
$('.box2').addClass('box22');
}
else{
$('.box2').removeClass('box22');
}
</script>
<script src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
var number = (1+Math.random()*(8-1)).toFixed(0);
if(number>3){
}
else{
$('#box1').remove();
}
if($('#box1')[0]){//判断
$('.box2').addClass('box22');
}
else{
$('.box2').removeClass('box22');
}
</script>

每天进步一点点,努力超越昨天的自己。

js,jquery判断某一节点是否存在的更多相关文章

  1. js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选

    转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...

  2. js jquery 判断元素是否在数组内

    js jquery 判断元素是否在数组内 一,js方法 var arr = ["a", "b", "c"]; // js arr.index ...

  3. js/jquery判断浏览器的方法小结

    在网站前端开发中,浏览器兼容性是前端开发框架要解决的第一个问题,要解决兼容性问题就得首先准确判断出浏览器的类型及其版本,而判断浏览器的版本一般只能通过分析浏览器的userAgent才能知道.今天我们把 ...

  4. js/jQuery判断浏览器名称、内核版本、浏览器壳

    1.js方法 /* 判断浏览器名称和版本 目前只能判断:ie/firefox/chrome/opera/safari 2012年5月16日23:47:08 浏览器内核UA:UA; 浏览器内核名称:NV ...

  5. js/jquery判断浏览器的方法总结

    JS获取浏览器信息浏览器代码名称:navigator.appCodeName浏览器名称:navigator.appName浏览器版本号:navigator.appVersion对Java的支持:nav ...

  6. js/jquery判断浏览器 & 停止加载

    JS获取浏览器信息 复制代码代码如下: 浏览器代码名称:navigator.appCodeName浏览器名称:navigator.appName浏览器版本号:navigator.appVersion对 ...

  7. js jquery 判断匹配元素是否存在

    jQuery 判断页面元素是否存在的代码 在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的. 例如: 复制代码 ...

  8. JS/JQuery判断是否移动设备+JS/JQuery判断浏览器类型

    原文:https://blog.csdn.net/Little_Stars/article/details/48624669 JS代码如下(点击事件依赖JQuery): //判断设备类型 $(&quo ...

  9. js/jquery判断一个对象是否为空

    一.js判断一个对象是否为空对象 1)通过JSON自带的.stringify方法来判断 //JSON自带的stringify方法,将json转成json字符串 var c = {}; if(JSON. ...

随机推荐

  1. centos6.6 设置静态网络

    [root@localhost ~]# vi /etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth0HWADDR=08:00:27:3D:5F:38 ...

  2. 【leetcode❤python】198. House Robber

    class Solution(object):    def rob(self, nums):        """        :type nums: List[in ...

  3. SQL查看表锁定,死锁解锁

    select request_session_id spid,OBJECT_NAME(resource_associated_entity_id) tableName from sys.dm_tran ...

  4. Pre-Update and Pre-Insert Trigger Examples For Oracle Forms

    See also: Why And When To Use Pre-Update and Pre-Insert Triggers In Oracle FormsPre-Update Fires dur ...

  5. R语言画图基础参数设置

    Graphical Parameters You can customize many features of your graphs (fonts, colors, axes, titles) th ...

  6. 用@RequestMapping映射请求

    DispatcherServlet接受一个web请求之后,将请求发送给@Controller注解声明的不同控制器类. 这个调度过程依赖控制器类及其处理程序方法中声明的各种@RequestMapping ...

  7. [Java解惑]数值表达式

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  8. CSS深入研究:display的恐怖故事解密(2) - table-cell(转)

    http://www.cnblogs.com/StormSpirit/archive/2012/10/24/2736453.html 上集<CSS深入研究:display的恐怖故事解密(1) - ...

  9. 06 SQL执行计划

    解释计划 与 执行计划的 区别 随着可以得到解释计划输出的开发工具, 比如 toad 的普遍使用, 生成解释计划就变的相当简单. 而不简单的是得到执行计划. 解释计划 EXPLAIN PLAN 用来显 ...

  10. Jmeter使用之常用函数介绍

    “_csvRead”函数 CsvRead函数是从外部读取参数,CsvRead函数可以从一个文件中读取多个参数. 下面具体讲一下如何使用csvread函数: 1.     新建一个csv或者text文件 ...