javascript - Javascript .css 不工作也不 jquery .blue

Question

我在 js 和 jQuery 中为简单的 html 设置样式时遇到了各种麻烦，这里似乎使用了一个 jsfiddle 来说明。我是新手，看不到控制台输出或期望的结果，所以我问这个问题以了解更多关于如何提供帮助的信息；我确实搜索过 .css 不工作和变体

javascript

    .css() 是 jQuery。
    .style 是 js。

document.getElementsByTagName('pre').text.css("color: blue;"); jquery: const preSentences = $("pre").text().split(".") console.log({preSentences})

    //no err no workee in chrome

// preSentences.forEach(function(str) { $(this).css("color: blue; border: 1px solid black")}); // $.each(preSentences, function(str) { $(this).blue }) // preSentences[1].style("color: blue; border: 1px solid black");

我想小提琴就在这里-我尝试了嵌入链接，但它没有显示出来： https ://jsfiddle.net/Lz8nh50o/

Answer 1

您可以使用 ES6 for-of 循​​环迭代 htmlCollention，它看起来更干净。

let list = document.getElementsByTagName('pre')

for (let currentElement of list){
    currentElement.style.color ='blue';
}

jQuery等价物是

jQuery('pre').css('color','blue');

Answer 2

getElementsByTagName 将返回一个标签数组，您必须遍历每个标签来设置样式。此外，您正在使用 .css() 但这是一个 jQuery 函数。你必须使用风格。

尝试这个：

var preTags = document.getElementsByTagName('pre');
for(var i=0; i<preTags.length; i++){
  preTags[i].style.color='blue';
}

Answer 3

// JS
document.querySelectorAll('pre').forEach(str => {str.style.color='blue';})

//jQuery
jQuery('pre').css('color','blue');