JQuery判断DIV中是不是包含图片标签

Posted 2023-05-10

JQuery判断DIV中是否包含图片标签,如果包含就把整个DIV的内容替换为第一张图片,否则就清空这个DIV,希望大侠们能给帮忙!!

$('div').find('img').replaceWith('替换内容');

其实我这个写法是个错误的逻辑,因为我没写判断图片标签.

但是,这个写法完全可以做到你想要的效果.因为jquery的一些运行机制表明如果find('img')找不到图片标签,其后代码就会终止运行,因为其传递到后续方法的参数是undefind而不是必须的obj.

详细请看下面jquery的源码.

//这是替换方法,可以看到jquery内部会判断传递过来的值;
replaceWith: function( value )  
  if ( !isDisconnected( this[0] ) ) 
     if ( jQuery.isFunction( value ) ) //这里判断;
  return this.each(function(i) 
  var self = jQuery(this), old = self.html();
self.replaceWith( value.call( this, i, old ) );
);


//判断方法:可以看到这里当参数传递到这里时如果不符合标准将会返回假,其下代码不执行.
//所以如果只是单纯的判断div里有没有图片标签并不需要另外写判断代码.
isFunction: function( obj ) 
return jQuery.type(obj) === "function";
,

type: function( obj ) 
return obj == null ?
String( obj ) :
class2type[ core_toString.call(obj) ] || "object";
,

参考技术A 先判断div中:
你的div应该有ID吧。
var divId = document.getElementById("divId");
var imgAll="";
if(divId.getElementsByTagName("img")!=null)
imgAll = divId.getElementsByTagName("img");
divId.innerHTML=imgAll[0].innerHTML;//将div内容替换为第一张图片

else
$("#divId").empty();//否则就清空这个div.


这里我用jquery跟js混搭着来写，你应该能看懂，加上jquery的库文件。没有测试，应该可以。 参考技术B 使用Jquery选择器 方法应该这样写.~$('div').find('img').length>0 参考技术C 哥不会JQuery，如果你已经获得div对象，何不判断下div.getElementsByTag("img").length是否大于0？哥只会手写代码。。。 参考技术D var $div=$('#divId'),$imgs = $div.find('img');
if($imgs.length>0)$div.html($($imgs[0]));
else $div.remove();

jquery 判断某元素是不是定义了 CSS

HTML:
<p class="acont"><a >我是一匹来自北方的狼</a></p>

CSS:
p.acont afloat:left; font-size:12px; /*注意此处没有定义margin-right*/

JQUERY:
alert($(".acont a").css("margin-right")); //返回“0px”

疑问：
.acont a在CSS中并没有定义“margin-right”属性，为什么jquery会返回0px呢？
我的目的：
在jquery中判断.acont a是否定义了“margin-right”属性，如果有的话，其值不变，如果没有的话，指定一个“margin-right”属性的值。

有劳了。
可能我没有表达明白，用下面的表格表达可能更明白些。

应该可以看出，判断CSS中是否定义跟0px还是有区别的。

这个js、jq都没办法判断是否定义某个css，
这里可以提供两个解决思路：1、有人已经说了判断值是否等于0；但是这样一来会有个弊端，如果css中确实定义了margin-right:0;也会把它当做未定义处理；
2、把css写成行内样式<a style="float:left; font-size:12px;">的</a>，这样可以获取style的值再判断是否有margin-right;
$(".acont a").each(function()
var ofright = $(this).attr("style").indexOf("margin-right");
if(ofright != (-1))alert("已定义");
else$(this).css("float":"left","font-size":"12px","margin-left":"10px");
);
如果只有一个就不需要循环了

好吧，再给你个思路，
在css中这么定义
.mrmargin-right:5px;
p.acont afloat:left; font-size:12px;
HTML中这么写:
<p class="acont"><a class="mr">我是一匹来自北方的狼</a></p>
这个思路是通过相同样式冲突覆盖来解决的
p.acont a中如果定义了margin-right就会覆盖.mr中的margin-right:5px;，使之不起作用
如果未定义.mrmargin-right:5px;这个就会起作用 参考技术A $("#div").attr("class")得到class的值，判断这个值是否为空。 参考技术B 没有定义margin-right，所以取默认值为0，
可以判断一下
if(parseInt($(".acont a").css("margin-left")) == 0)
$(".acont a").css("margin-left","10px");