Fatal编程技术网
  • javascript/
  • Javascript jQuery搜索为h6标记设置HTML，如果为空，则删除并更新源变量

Javascript jQuery搜索为h6标记设置HTML，如果为空，则删除并更新源变量

javascript jquery html

Javascript jQuery搜索为h6标记设置HTML，如果为空，则删除并更新源变量,javascript,jquery,html,Javascript,Jquery,Html,下面的代码读取源数据并在变量中设置html，在执行此操作之前，我需要在html源中搜索任何空的h6标记（如果找到），以删除它们并更新源变量，以便在其他函数中正确处理 由于编辑器有时会添加空的，因此会破坏生成的选项卡，因此有时也会添加空的，因此如果是这种情况，最好也删除它 工作示例： 宽度为空的h6，h6子跨度稍微断裂： JS: $（文档）.ready（函数（）{ var originalTabs=$（'.originalTabs'）.html（）； var windowWidth=0； var-

下面的代码读取源数据并在变量中设置html，在执行此操作之前，我需要在html源中搜索任何空的h6标记（如果找到），以删除它们并更新源变量，以便在其他函数中正确处理

由于编辑器有时会添加空的
，因此会破坏生成的选项卡，因此有时也会添加空的
，因此如果是这种情况，最好也删除它

工作示例： 宽度为空的h6，h6子跨度稍微断裂：

JS:

$（文档）.ready（函数（）{
var originalTabs=$（'.originalTabs'）.html（）；
var windowWidth=0；
var-swapSpeed=0；
速度=0；
函数clearTabs（）{
$（'.originalTabs'）.html（originalTabs）；
}
//clearTabs（）；
//桌面选项卡（）；
函数desktopTabs（）{
clearTabs（）；
//用于桌面的cretate选项卡
风险值标题=$（“#选项卡描述h6”）；
$（'tab#tab_description h6'）。每个（功能（i）{
$（this.nextUntil（“h6”）.andSelf（）.wrapAll（“”）；
});
对于（变量i=0；i”）；
}
$（'ul.tabs'）。每个（函数（）{
var-active，content，links=$（this.find（'a'）；
var listitem=$（this.find（'li'）；
active=listitem.first（）.addClass（'active'）；
content=$（active.attr（'href'）；
$（'.tab'）.hide（）；
$（this）。查找（'a'）。单击（函数（e）{
$（'.tab'）.hide（）；
$（'ul.tabs li'）.removeClass（'active'）；
content.hide（）；
活动=$（此）；
content=$（$（this.attr（'href'））；
active.parent（）.addClass（'active'）；
content.show（）；
返回false；
});
});
headers.remove（）；//从描述中删除头
$（'#tab-0'）.show（）；//显示第一个选项卡
$（“#选项卡_说明”）.show（）；
}
函数mobiletab（）{
clearTabs（）；
//警报（“装载手机”）；
风险值标题=$（“#选项卡描述h6”）；
$（标题）。每个（函数（i）{
$（此）。附加（“”）；
//$（this.nextUntil（“h6”）.andSelf（）.wrapAll（“”）；
$（此）.on（'单击tap'，函数（））{
tabClick（$（this））；
});
});
$（'#tab_description h6'）.first（）.addClass（“活动”）；
$（'#tab#u description h6'）.first（）.nextUntil（“h6”）.show（）；
$（“#选项卡_说明”）.show（）；
}
var tabClick=函数（x）{
//警报（“点击”）；
var accordionContent=$（“#tab#u description p，#tab#u description ul，#tab#u description table，#tab#u description div”）；
//$（'#tab#u description h6'）。removeClass（“活动”）；
if（！$（x）.hasClass（“活动”））{
$（x）.addClass（“活动”）；
$（'#tab#u description h6'）。removeClass（“活动”）；
$（手风琴内容）.slideUp（交换种子）；
$（'#选项卡_description div>div'）.show（）；
$（x）.addClass（“活动”）；
$（x）.nextUntil（'h6'）.slideDown（swapSpeed）.promise（）.then（function（））{
//$（'body，html'）.css（'height'，'auto'）；
滚动标签（$（x））；
});
}否则{
$（'#tab#u description h6'）。removeClass（“活动”）；
if（$（x）.next（“p”）.css（'display'）='none'）{
$（'#选项卡_description div>div'）.show（）；
$（x）.nextUntil（'h6'）.slideDown（swapSpeed）.promise（）.then（function（））{
//$（'body，html'）.css（'height'，'auto'）；
滚动标签（$（x））；
});
}否则{
//$（'body，html'）.css（'height'，'auto'）；
$（手风琴内容）.slideUp（交换种子）；
}
}
返回false；
}
函数scrollToTab（x）{
$（“html，body”）.animate({
scrollTop:$（x）.offset（）.top-10
}，滚动速度）；
}
//加载默认值
//$（函数（）{
if（isMobileLandscapeOnly.matches | | isTabletLandscapeOnly.matches）{
//警报（“手机/平板电脑（肖像）”；
桌面选项卡（）；
//$（“#tab_description h6”）。打开（“单击，点击”，tabClick）；
//控制台日志（原始数据库）；
}else if（IsMobilePortraytonly.matches | | IsTabletPortraytonly.matches）{
//警报（“手机/平板电脑（肖像）”；
mobiletab（）；
//$（“#tab_description h6”）。打开（“单击，点击”，tabClick）；
}else if（isDesktop）{
//警报（“桌面”）；
桌面选项卡（）；
}
//});
});
HTML示例：

<div class="originalTabs">
  <h6>title 1</h6>
  <p>tab 1 content</p>
  <h6>title 2</h6>
  <p>tab 2 content</p>
  <p>tab 2 content</p>
  <p>tab 2 content</p>
  <h6>title 3</h6>
  <p>tab 3 content</p>
</div>


标题1
表1内容

标题2
表2内容

表2内容

表2内容

标题3
表3内容
JS使用上面的方法创建一个generate选项卡，该选项卡可以工作，但是如果编辑器中有空格，则需要在创建之前进行检查并删除

<div class="originalTabs">
  <h6>title 1</h6>
  <p>tab 1 content</p>
  <h6><span></span></h6>
  <h6>title 2</h6>
  <p>tab 2 content</p>
  <p>tab 2 content</p>
  <p>tab 2 content</p>
  <h6></h6>
  <h6>title 3</h6>
  <p>tab 3 content</p>
</div>


标题1
表1内容

标题2
表2内容

表2内容

表2内容

标题3
表3内容
真的，需要找到空的并移除

第三方物流来源

<div class="originalTabs">

  <ul class="tabs">
    <!--holder for h6 tabs -->
  </ul>

  <div id="tab_description">
    <h6>title 1</h6>
    <p>tab 1 content</p>
    <h6>title 2</h6>
    <p>tab 2 content</p>
    <p>tab 2 content</p>
    <p>tab 2 content</p>
    <h6>title 3</h6>
    <p>tab 3 content</p>
  </div>

</div>



    


标题1
表1内容

标题2
表2内容

表2内容

表2内容

标题3
表3内容
我的代码在这里，我想你想要这样的东西，但是css在你移除h6标签后会有一些问题需要处理

备注：您应该检查为什么您的程序将生成空标记

参考：

--移动值并保留标记

--移除整个标签

<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.0.min.js"></script>
</head>

<html>
    <h6>abc</h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6></h6>
    <h6>abc</h6>
</html>


<script type="text/javascript">

$( document ).ready(function() {
    var list = $("html").find("h6");
    console.log(list);
    $.each(list, function( index, value ) {
      if (value.innerText  == ""){
        list[index].remove();
      }
    });
});

</script>


abc
abc
$（文档）.ready（函数（）{
var list=$（“html”）.find（“h6”）；
控制台日志（列表）；
$.each（列表、函数（索引、值）{
如果（value.innerText==“”）{
列表[索引]。删除（）；
}
});
});
您可以通过此表达式搜索没有文本的每个
h6

由此

如果它不起作用，你会看到2个红色边框的框

<head> <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.0.min.js"></script> </head> <html> <h6>abc</h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6></h6> <h6>abc</h6> </html> <script type="text/javascript"> $( document ).ready(function() { var list = $("html").find("h6"); console.log(list); $.each(list, function( index, value ) { if (value.innerText == ""){ list[index].remove(); } }); }); </script> 
 if(!$(this).text().trim().length)