javascript - 使用 jQuery 更改 css 样式（在容器内）

Question

这是 jsFiddle：http: //jsfiddle.net/JFwDw/2/

我想要做的是使用链接来更改段落的字体大小和行高，仅在一个部门标识的“内容”内。我已经建立了另一个部门，以确保它不会在其他任何地方发生变化......在玩了一段时间后无法让它工作。

提前致谢。

score 3 · Accepted Answer

您想更改正在使用的选择器。而不是对所有p标签做，你只想要下面的标签#content

$("#content p, #content ul").css()

您的链接还链接到<a href=""...导致页面重新加载的链接。我把它改成href="#"这样就不会发生了。您还可以防止默认事件在函数内部发生。

function origText() {
    event.preventDefault()
    ...

在旁注中，我无法弄清楚为什么这些函数在小提琴的 JS 部分中不起作用......

score 1 · Accepted Answer

好吧，一方面，您的链接正在被激活并重新加载页面。

通常，当您编写 jQuery 时，您将使用选择器附加事件，而不是使用内联代码。这让您可以将 JavaScript 和 HTML 保存在单独的文件中，并允许 jQuery 在需要时删除事件。

<a href="#" id="bigText">big text</a>

$('#bigText').click( function(event) {
   // code here
} );

然后要防止默认动作（如下链接），可以使用jQuery方法，防止默认动作。

$('#bigText').click( function(event) {
   event.preventDefaultAction();
   // code here
} );

您还可以使用文档就绪事件来包装事件绑定代码，以确保在尝试将事件附加到它之前加载 DOM。

$(document).ready( function() {
   $('#bigText').click( function(event) {
      event.preventDefaultAction();
      // code here
   } );
} );

此外，您通常希望添加一个类来更改元素的样式，而不是使用 jQuery 来更改样式。它的性能更高。此外，如果您只想影响容器中的元素，您可以使用 jQuery“查找”方法来执行此操作。

$('#someContainer').find('p').addClass('someClass');

score 1 · Accepted Answer

这对我有用。

编辑：我认为这就是你想要实现的目标！

3 回答 3