Як додати `style = display:" block "до елемента за допомогою jQuery?


Відповіді:


345
$("#YourElementID").css("display","block");

Редагувати: або як вказує Дейв Тібен у своєму коментарі нижче, ви також можете це зробити:

$("#YourElementID").css({ display: "block" });

20
або.css({ display: "block" });
dave thieben

8
@dave - або .css({ "display": "block" });просто для короткого замикання будь-яких проблем, викликаних displayзмінною. - JSLint відхилить версію без лапок. ( github.com/douglascrockford/JSLint/isissue/110 )
Пітер Айтай

Задача Json-esque корисна для надсилання її по трубах. Мені це подобається.
Луїс Роблес

35

Залежно від мети встановлення властивості відображення, ви можете поглянути

$("#yourElementID").show()

і

$("#yourElementID").hide()

27

Для виконання цієї роботи існує декілька функцій, написаних внизу, залежно від пріоритету.

Встановіть одну або декілька властивостей CSS для набору відповідних елементів.

$("div").css("display", "block")
// Or add multiple CSS properties
$("div").css({
  display: "block",
  color: "red",
  ...
})

Відображення відповідних елементів і приблизно еквівалентно дзвінкам.css("display", "block")

Ви можете відображати елемент, використовуючи .show()натомість

$("div").show()

Встановіть один або кілька атрибутів для набору відповідних елементів.

Якщо цільовий елемент не має styleатрибута , ви можете використовувати цей метод, щоб додати стиль вбудованого елемента до елемента.

$("div").attr("style", "display:block")
// Or add multiple CSS properties
$("div").attr("style", "display:block; color:red")

  • JavaScript

Ви можете додати специфічну властивість CSS до елемента за допомогою чистого JavaScript , якщо ви не хочете використовувати jQuery.

var div = document.querySelector("div");
// One property
div.style.display = "block";
// Multiple properties
div.style.cssText = "display:block; color:red"; 
// Multiple properties
div.setAttribute("style", "display:block; color:red");

11

Якщо вам потрібно додати кілька, ви можете зробити це так:

$('#element').css({
    'margin-left': '5px',
    'margin-bottom': '-4px',
    //... and so on
});

Як хорошу практику я також ставлю назву властивості між лапок, щоб дозволити тире, оскільки більшість стилів мають тире в них. Якщо це було 'display', то лапки необов’язкові, але якщо тире, ти не буде працювати без лапок. У будь-якому випадку для спрощення: завжди додайте їх до лапок.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.