Question

我试图将所有粗体字符更改为斜体字符，反之亦然。我想我需要遍历整个文档。

到目前为止，我定义了两个样式和函数的一部分，不确定是否需要样式。

resume

Answer 1

嗯，您可以使用app.controller('employeeDetailsController', function($scope, $state, $stateParams, $document, employeesService) { $scope.employeeId = $stateParams.employeeId; $scope.icon = $stateParams.icon; $scope.iconAlt = $stateParams.iconAlt; $scope.title = $stateParams.title; $scope.firstName = $stateParams.firstName; $scope.lastName = $stateParams.lastName; $scope.dateOfBirth = $stateParams.dateOfBirth; $scope.niNumber = $stateParams.niNumber; $scope.jobTitle = $stateParams.jobTitle; $scope.department = $stateParams.department; $scope.joinDate = $stateParams.joinDate; $scope.leaveDate = $stateParams.leaveDate; $scope.email = $stateParams.email; $scope.phonePrimary = $stateParams.phonePrimary; $scope.phoneSecondary = $stateParams.phoneSecondary; $scope.employeePayments = $stateParams.employeePayments;执行此操作，只考虑根据当前班级交换querySelectorAll和.bold：

.italic

function swapCollection( collection, from, to ) {
  if ( !collection ) {
    return;
  }
  
  for( let i = 0; i < collection.length; ++i ) {
    const elm = collection[ i ];
    elm.classList.remove( from );
    elm.classList.add( to );
  }
}

function swap() {
  const allBold = document.querySelectorAll( '.bold' );
  const allItalic = document.querySelectorAll( '.italic' );
  
  swapCollection( allBold, 'bold', 'italic' );
  swapCollection( allItalic, 'italic', 'bold' );
}

document.getElementById( 'swap' ).addEventListener( 'click', swap );

.bold {
  font-weight: bold;
}

.italic {
  font-style: italic;
}

Answer 2

您还可以使用getElementsByClassName选择类并更改样式：

   function swap() {
    var mass=document.getElementsByClassName("bold");
      for (i in mass){
        mass[i].style.fontWeight="normal";
      }
    }

Answer 3

为可以一劳永逸地完成的事情添加JS脚本没有用。因此，请尝试通过添加以下CSS代码来覆盖CSS文件中的strong和em标签的默认样式

strong, b{ font-weight: normal!important; font-style: italic!important;  }
em, i{font-style: normal!important; font-weight: bold!important; }

然后替换CSS文件中的所有属性

font-style: italic; by font-weight: bold;

和

font-weight: bold; by font-style: italic;

使用您的IDE

Answer 4

这是一个使用jQuery的通用解决方案，不仅仅基于类名。我把粗体文字做成红色，这样你就可以很容易地看到它。

$('div').each(function () {
  if ($(this).css('font-weight') == 'bold') {
  	$(this).css('color', 'red'); // but you change to italic
    return;
  }
  if ($(this).css('font-style') == 'italic') {
  	$(this).css('color', 'green'); // but you change to bold
    return;
  }
  
});

.one, .three {font-weight: bold;}
.five {font-style: italic;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="one">aaa</div>
<div>ccc</div>
<div class="three">ddd</div>
<div>eee</div>
<div style="font-weight: bold;">lala</div>
<div style="font-style: italic;">tata</div>
<div>nana</div>
<div class="five">dada</div>

如果您想对粗体和斜体的文字应用某些内容，请移除return块中的if。

Answer 5

如果仅仅是切换课程，你可以这样做。每次单击按钮时，它都会将粗体文本更改为斜体，反之亦然。

＆＃13;

const
  trigger = document.getElementById('trigger');
  
function toggleClasses() {
  const
    // Get all the elements with the bold and/or italic class.
    elements = document.querySelectorAll('.bold, .italic');
  
  // Iterate over all the elements
  elements.forEach(element => {
    // For each element, toggle the bold and italic classes.
    element.classList.toggle('bold');
    element.classList.toggle('italic');
  });
}
  
trigger.addEventListener('click', toggleClasses);

＆＃13;

.bold {
  font-weight: bold;
}
.italic {
  font-style: italic;
}

＆＃13;

<p class="bold">initally bold</p>
<p class="bold">initally bold</p>
<p class="italic">initally italic</p>
<p class="bold">initally bold</p>
<p class="italic">initially italic</p>
<button id="trigger" type="button">toggle classes</button>

＆＃13;

Answer 6

您可以只使用.bold和toggle .italic个document.querySelectorAll(".bold, .italic")的节点列表收集classList和var sps = document.querySelectorAll(".bold, .italic"), mbt = document.getElementById("mbt"); mbt.addEventListener("click", _ => sps.forEach(function(sp){ sp.classList.toggle("bold"); sp.classList.toggle("italic"); }));个班级的所有项目。

＆＃13;

.bold {
  font-weight: bold;
}

.italic {
  font-style: italic;
}

＆＃13;

<p><span class="bold">Hello</span> <span class="italic">World</span></p>
<button id="mbt">Toggle</button>

＆＃13;

class Question < ApplicationRecord
  def gravatar
    "http://www.gravatar.com/avatar/#{Digest.MD5.hexdigest(email)}"
  end
end

＆＃13;

如何检查字母是否粗体？

6 个答案: