innerHTML在jQuery对象上使用时不能正常工作

innerHTML not working properly when used on a jQuery object

本文关键字:常工作 工作 不能 jQuery 对象 innerHTML      更新时间:2023-09-26

这段代码没有按预期工作。它不显示span内的任何文本。它应该显示今天的日子(撰写本文时为星期二)。它也没有正确地添加类"currentDay"在$.each回调。

 $('#showLess span.day').innerHTML=weekday[today]; 
 $.each($('#showMore p span.day'), function(index, item) {  
      if(typeof item.innerHTML != 'undefined') 
      {     
           alert('item.text:' +item.innerHTML);
           alert('weekday[today]'+item.innerHTML.indexOf(weekday[today])); 
           if(item.innerHTML.indexOf(weekday[today])!=-1) { 
                alert("check which element has added class currentDay:");
                item.addClass('currentDay');
           }else{
                if(item.hasClass('currentDay')) {
                     item.removeClass('currentDay'); 
                }
           }
      } 
 });

.innerHTML没有改变HTML,额外的类没有按预期添加。

<p id="showLess" class="less">
        <span class="day">**Tuesday**</span>
</p>

为什么天不亮?

为什么show/hide不工作?

$('.less').on('click', function(e) {
            $('#showMore').show();
            $('#showLess').hide();
        });
        $('.more').bind('click', function(e) {
            $('#showLess').show();
            $('#showMore').hide();
        });

你试图在jQuery对象上调用JS属性。

例如innerHTML

你试图在一个jQuery对象上调用它

$('#showLessHours span.day').innerHTML

应该是

$('#showLessHours span.day')[0].innerHTML

$('#showLessHours span.day').html(weekday[today]);

在你的each loop 项目是一个JS对象,你正试图使用jQuery添加一个类。首先将其转换为jQuery对象。

item.addClass('currentDay');
item.removeClass('currentDay');

应为

$(item).addClass('currentDay');  or $(this).addClass('currentDay');
$(item).removeClass('currentDay'); or $(this).removeClass('currentDay')

你也可以在回调中使用$(this)对象而不是$(item)对象,因为它们都引用相同的对象。

另一个小建议是,当你想在你的应用程序中使用jQuery时,为什么你想要混合使用jQuery和jQuery。

jsFiddle

因为。innerhtml不是jquery函数。您可以使用.html()来实现您想要做的事情。或者,如果你真的想使用。innerhtml,你可以使用。get()来获取实际的DOM元素,然后使用。innerhtml但是…我不推荐。

我相信这个编辑的小提琴解决了你的问题。相关代码:

$('#showLessHours span.day').html(weekday[today]);
//...
if(item.html() != '') {     
    alert('item.text:' +item.text());
    alert('weekday[today]'+item.text().indexOf(weekday[today]));
    if(item.html().indexOf(weekday[today])!=-1) {
//...

除了Sushanth所说的,您还试图在javascript对象上调用jQuery方法。

item.addClass

应该

$(item).addClass