如何删除树枝中的空格

Question

我需要什么

我需要从 html 中删除空格。
我需要点赞
```
<html>
-- data----
</html>
```
额外的空格被删除，以删除 html 元素之间的额外空格，还有 sypmfony 支持的。

代码

{% spaceless%}

  ---code----

{% endspaceless %}

调试

整个 Twig 代码

                     {% spaceless %}

                <head>

                {% block title %}
                <title>times</title>
                <meta http-equiv="content-type" content="text/html; charset=utf-8" />
                <meta name="description" content="" />
                <meta name="keywords" content="" />
                {% endblock %}  
                <meta property="fb:admins" content="10timesevents" />
                <meta property="fb:app_id" content="432858816746099" />

                {% block css %}

                <noscript>
                <link rel="stylesheet" href="http://im.gifbt.com/css/skel-noscript.css" />

                <link rel="stylesheet" href="http://im.gifbt.com/css/style9.css" type="text/css" >

                {% if DeviceDetcet() =='computer' %}
                <link rel="stylesheet" href="http://im.gifbt.com/css/style9-desktop.css" type="text/css  />

                {% elseif DeviceDetcet() =='tablet' %}

                <link rel="stylesheet" href="http://im.gifbt.com/css/style9-1000px.css" type="text/css  />

                {% elseif DeviceDetcet() =='phone' %}
                <link rel="stylesheet" href="http://im.gifbt.com/css/style9-mobile.css" type="text/css  />

                {%endif%}
                </noscript> 
                {% endblock %}

                {% block scripts %}
                <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600' rel='stylesheet' type='text/css' />     
                <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>


                {#      <script src="http://im.gifbt.com/js/jquery.poptrox-2.2.js"></script>#}
                <script src="http://im.gifbt.com/js/skel.min.js"></script>




                {% if DeviceDetcet()=='phone'%}
                <script src="http://im.gifbt.com/js/skelnew-panels.min.js"></script>
                {%endif%}
                <script src="http://im.gifbt.com/js/common.10.min.js"></script>
                <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>


                {% endblock %}



                <!--[if lte IE 8]><script src="http://im.gifbt.com/js/html5shiv.js"></script><link rel="stylesheet" href="http://im.gifbt.com/css/ie8.css" /><![endif]-->

                </head>
                {% block body_tag %}
                <body>
                {% if  'android' in UserAgent() or 'Android' in UserAgent() %}
                <div style="position:fixed; width:100%; z-index:9; right:0; left:0; bottom:0;">
                <div class="row flush">
                <div style="height:60px; background:#fb6d02; padding:14px 7px 7px 7px!important; border-bottom:1px solid #e16000; border-top:1px solid #e16000">
                <img src="http://im.gifbt.com/images/android100.png"style="float:left; width:30px; padding:0 5px 0 0" />
                <p style=" font-size:.9em; line-height:1.1em; margin:0; ">
                <a href="https://play.google.com/store/apps/details?id=com.tentimes&referrer=utm_source%3Dsite%26utm_medium%3Dbottom-banner" target="_blank" style="float:right; font-size:1.1em; line-height:1.6em; text-decoration:none; color:#fff; background:#333335; padding:.3em .7em; margin-top:1px;">Download Now</a>
                <b class="bld" style="float:left; padding:7px 0 0 0; color:#fff">Stay updated with 10times App</b>
                </p>
                </div>
                </div> 
                </div>

                {% endif %}
                <span id="evtname"></span>

                <!-- Google Tag Manager -->
                <noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-MMVJS3" 
                height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
                <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
                new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
                j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
                '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
                })(window,document,'script','dataLayer','GTM-MMVJS3');</script>
                <!-- End Google Tag Manager --> 
                {% endblock %}
                <!-- Header Wrapper -->
                {% block homepage_head %}
                {#Fixed navbar#}
                <div class="navbar navbar-static navbar-default navbar-fixed-top" style="margin:0; min-height:38px; offsetheight:38px!important">
                <div class="not-mobile" style="background:#fff">
                <div class="new_header">
                <div class="headerdiv">
                <div class="l">
                <ul class="navigation">
                <li><a href="{{ DomainDetect()}}/tradeshows">Trade Shows</a></li>
                <li><a href="{{ DomainDetect()}}/conferences">Conferences</a></li>
                <li><a href="{{ DomainDetect()}}/top100">Top 100</a></li>
                <li><a href="{{ DomainDetect()}}/venues">Venues</a></li>
                </ul>
                </div>
                <div class="c">
                <a href="http://10times.com" class="newlogo" ></a>
                </div>
                <div class="r">
                <div class="user-nav">
                <div id="header-login-dd-link">&nbsp;
                <div class="user-dropdown dis-non">
                <ul class="udr">

                <li><a class="manage udbr" href="http://{{-login_url}}">Manage Event</a></li>
                <li><a class="contact udbr" onclick="feed_back();">Contact Us</a></li>
                <li><a class="signin udbr" onclick = "signin();">Sign In</a></li>
                <li><a class='dashboard udbr' href='http://{{-login_url}}/dashboard'>My Dashboard</a></li>


                </ul>
                </div>
                </div>
                </div>
                <div class="screen-block" style="display: none;"></div>

                <a class="advt" href="{{ DomainDetect()}}/services">Advertise</a>
                <a href="{{ DomainDetect()}}/addevent" class="adevnt">Add Event</a>
                <div class="searchdiv">
                <span style="margin-top:10px" class="srhbx 4u" id="srh"><input type="button" value=" " class="srhbtn" onclick="checkHeaderSearch($(this));" id="explore-button" style="float:right" /><div id="search-box-area" class="p-relative search-box-area zind"><input type="text" name="" autocomplete="off" id ="explore-keywords" placeholder="search" 
                class="srhtxt homesearch" style="width:75%" required /><div id="explore-keywords-dropdown" autocorrect="off" ><div id="keywords-dd" class="kkdd"><ul id="keywords-by" style="margin:0;"></ul></div></div></div></span>
                </div> 
                </div>
                {#<div class="searchdiv">
                <form action="{{ DomainDetect()}}/search" method="get" id="srh">
                <div class="srhbx" id="search-box-area ">
                <input type="text" class="srhtxt homesearch" autocomplete="off" id ="explore-keywords" placeholder="Search" name="q" {% if DeviceDetcet()=='computer'%} style="width:75%" {%endif%}  required="">
                <input type="submit" value="&nbsp;" class="srhbtn" required="" >
                <div id="explore-keywords-dropdown"  autocorrect="off" >
                <div id="keywords-dd" class="kkdd">
                <ul id="keywords-by" style="margin:0;"></ul>
                </div></div>
                </div>
                </form>
                </div>  
                </div>#}
                </div>
                </div>
                </div>

                <div class="only-mobile">
                <div class="new_header">
                <div id="hide-header" class="headerdiv">
                <div class="l">


                <button type="button" class="navbar-toggle toggle-left" data-toggle="sidebar" data-target=".sidebar-left" style="margin:4px 0 0 5px; border:0; padding:8px">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                </button>

                </div>
                <div class="c">
                <a href="/" class="newlogo"></a>
                </div>
                <div class="r">
                <div class="mobile_menu">
                <a onclick="change();" class="srhbtn">&nbsp;&nbsp;</a>
                </div>
                </div>
                </div>
                <div id="search-field" class="headerdiv dis-non" style="display: none;">
                <form method="get" action="http://10times.com/search" id="srh" class="mr">
                <div class="ll">

                <button type="button" class="navbar-toggle toggle-left" data-toggle="sidebar" data-target=".sidebar-left" style="margin:4px 0 0 5px; border:0; padding:8px">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                </button>
                </div>
                <div id="search-field" class="cc">
                <input type="hidden" name="cx" value="partner-pub-8525015516580200:vtujn0s4zis">
                <input type="hidden" name="cof" value="FORid:10">
                <input type="hidden" name="ie" value="ISO-8859-1">
                <input type="text" name="q"  id ="q"    placeholder="Search..."    class="srhtxt1" required />

                </div>
                <div class="rr">
                <input type="submit" value="&nbsp;" class="srhbtn1">
                </div>
                </form>
                </div>
                </div>
                </div>

                </div>{#endo of new main col-md-12#}
                <div class="col-xs-7  col-md-3 sidebar sidebar-left sidebar-animate" style="background:#212628; padding:0; top:39px; position:fixed!important">


                <div id="sidebar-wrapper" class="only-mobile">
                <ul class="sidebar-nav" style="margin:0; padding:0;">
                <li class="only-mobile"><a href="{{ DomainDetect()}}" class="hm">Home</a></li>
                <li class="only-mobile"><a href="{{ DomainDetect()}}/tradeshows" class="ts">Trade Shows</a></li>
                <li class="only-mobile"><a href="{{ DomainDetect()}}/conferences" class="con">Conferences</a></li>
                <li class="only-mobile"><a href="{{ DomainDetect()}}/top100" class="tp">Top 100</a></li>
                <li class="only-mobile"><a href="{{ DomainDetect()}}/venues" class="vn">Venues</a></li>
                <li class="only-mobile"><a href="http://{{-login_url}}/addevent" class="ae">Add Event</a></li>
                <li class="only-mobile"><a href="{{ DomainDetect()}}/services" class="ad">Advertise</a></li>
                <li class="only-mobile"><a href="http://login.10times.com" class="mng">Manage Event</a></li>
                </ul>
                </div>

                </div>

                </div>{#endo of row#}   

                </div>
                {% block heightfromhead %}
                <div style="height:51px" class="not-mobile">&nbsp;</div>
                <div style="height:40px" class="only-mobile">&nbsp;</div>
                {% endblock %}


                <!-- header end -->

                {% endblock %}
                {# {% block search_head %}body goes here!{% endblock %}         #}
                {% block body %}body goes here!{% endblock %}

                <!-- PAGE END -->

                <script type="text/javascript">
                function feed_back(){modal.open({content:'<div class="12u skel-cell-mainContent"><div class="box panel pd"><image src="/img/lineloading.gif"></div></div>'});$.get("/feedback",function(e){modal.open({content:e})})}
                </script>


                <script async src="http://im.gifbt.com/js/suggestive_search_2.js"></script>

                {% block bottom_script %} 
                <script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

                {% endblock %}
                {#          <script type="text/javascript">#}
                {# $(document).ready(function(){#}
                {#  $("#searchpanel").removeClass('dis-non');   #}
                {# });#}
                {# </script>#}
                </div>


                {% if  'android' in UserAgent() or 'Android' in UserAgent() %}
                <script>
                $( document ).ready(function() {
                {% if cookie('get','10tphpopup') == '0'%}
                {{-cookie('get','10tphpopup')}}
                {{-cookie('set','10tphpopup',1,3600*24*365)}}
                //$("div").first().addClass('dis-non');
                var height=$( window ).height();
                //height=height-50;
                height=height+"px";


                {%endif%}
                });
                </script>

                {%endif%}
                {% if  'iPhone' in UserAgent() or 'iphone' in UserAgent() %}
                <script>
                $( document ).ready(function() {
                {% if cookie('get','10tphpopup') == '0'%}
                {{-cookie('get','10tphpopup')}}
                {{-cookie('set','10tphpopup',1,3600*24*365)}}
                //$("div").first().addClass('dis-non');
                var height=$( window ).height();
                //height=height-50;
                height=height+"px";



                //modal.open({content:'<div class="12u skel-cell-mainContent"><div class="box panel pd"><image src="/img/lineloading.gif"></div></div>'});$.get("{{ DomainDetect()}}/android?type=iphone",function(e){modal.open({content:e})})
                {%endif%}
                });

                </script>

                {%endif%}

                {% block bottom_script2 %} 


                {%endblock%}
                {% block bottom_script3 %} 

                {#<link rel="stylesheet" type="text/css" href="{{ DomainDetect()}}/headersearch.css" />#}


                {%endblock%}
                {% if  'android' in UserAgent() or 'Android' in UserAgent() %}
                <script type="text/javascript">
                if(sessionStorage.getItem("count1")=='NaN')
                {
                sessionStorage.setItem("count1", 0);
                counters = 0;
                }
                if(sessionStorage.getItem("count1") == null)
                {
                sessionStorage.setItem("count1", 0);
                counters = 0;
                }
                else
                {
                counters= parseInt(sessionStorage.getItem("count1"));
                //alert(sessionStorage.getItem("count1"));
                }
                if (page_count == 4)
                {
                dataLayer.push({'event':'mobilePromo-android'});
                }

                </script>

                {% endif %}
                {%if 'iPhone' in UserAgent() or 'iphone' in UserAgent() %}

                <script type="text/javascript">

                if(sessionStorage.getItem("count2")=='NaN')
                {
                sessionStorage.setItem("count2", 0);
                counters = 0;
                }
                if(sessionStorage.getItem("count2") == null)
                {
                sessionStorage.setItem("count2", 0);
                counters = 0;
                }
                else
                {
                counters= parseInt(sessionStorage.getItem("count2"));
                //alert(sessionStorage.getItem("count2"));
                }
                if (page_count == 4)
                {
                dataLayer.push({'event':'mobilePromo-iphone'});
                }

                </script>


                {% endif %} 
                </body>


                </html>

                {% endspaceless %}

html 使用 spaceless

后

  <img class="featurebanner lazy" data-       
  src="http://10times.com/pics/event/1742/header_small_v47139.jpg"  
  src="http://im.gifbt.com/images/event-images-default.jpg" alt=""><h3><a href="intersec">

                                            Intersec

       </a></h3></div><div class="evt_date"><span>18-20 Jan  </span> &bull; Dubai, UA

html 输出应该是这样的

  <img class="featurebanner lazy" data-src="http://10times.com/pics/event/1742/header_small_v47139.jpg"  
  src="http://im.gifbt.com/images/event-images-default.jpg" alt=""><h3><a href="intersec">Intersec</a></h3></div><div class="evt_date"><span>18-20 Jan  </span> &bull; Dubai, UA

Answer 1

如您提供的文档中所述，您需要将 ---code---- 包装到某个变量中，然后在删除空格的情况下输出它。

但我认为您已经将数据保存在某个变量中，因此您的代码应该如下所示：

{% spaceless %}
<img class="featurebanner lazy" data-       
src="http://10times.com/pics/event/1742/header_small_v47139.jpg"  
src="http://im.gifbt.com/images/event-images-default.jpg" alt=""><h3><a href="intersec">
{{- intersec -}}
   </a></h3></div><div class="evt_date"><span>18-20 Jan  </span> &bull; Dubai, UA
{% endspaceless %}

如何删除树枝中的空格

How to Remove spaces in twig

html

symfony

twig