如何隐藏不在HTML标签内的文本？

Question

<div class="padd10_m">
<a href="http://www.caviarandfriends.com/job_board/user-profile/admin/" class="grid_view_url_thing1">admin</a> 
US <img src="http://www.caviarandfriends.com/job_board/wp-content/themes/PricerrTheme/images/flags/us.png">                
</div>

在上面的代码中我想隐藏"美国"字样.我在美国之后隐藏了这张图片,但无法找到隐藏这个"美国"字样的方法.什么可能是隐藏它的代码？

Answer 1

像这样的东西吗？

.padd10_m {
  font-size: 0px;
}
.padd10_m > * {
  font-size: 14px;
  /* Apply normal font again */
}

<div class="padd10_m">
  <a href="http://www.caviarandfriends.com/job_board/user-profile/admin/" class="grid_view_url_thing1">admin</a> US
  <img src="http://www.caviarandfriends.com/job_board/wp-content/themes/PricerrTheme/images/flags/us.png">
</div>

工作小提琴

或者

如果你想使用 JavaScript（虽然我不明白为什么），这里是解决方案：

var pad = document.querySelector('.padd10_m');
Array.prototype.forEach.call(pad.childNodes, function(el) {
  if (el.nodeType === 3) {   // check if it is text node
    pad.removeChild(el);     // remove the text node
  }
});

<div class="padd10_m">
  <a href="http://www.caviarandfriends.com/job_board/user-profile/admin/" class="grid_view_url_thing1">admin</a> US
  <img src="http://www.caviarandfriends.com/job_board/wp-content/themes/PricerrTheme/images/flags/us.png">
</div>