Синтаксис Javascript?

ProgramBox

Синтаксис Javascript?

Post author:admin
Запись опубликована:18 мая, 2023
Post category:Вопросы по программированию

#javascript

Вопрос:

Я даже не уверен, как назвать то, что я хочу. Итак, позвольте мне объяснить это, приведя пример.

В то время как Firefox использует textContent , другие браузеры поддерживают свойство innerText. Кстати, пожалуйста, поправьте меня, если я использую неправильную терминологию. В любом случае, пока все в порядке. Но я хочу что-то вроде следующего:

 document.getElementById(id).iText = "blablabla" 
//or
var x = document.getElementById(id).iText;
//where iText is something like:

if(e.innerText) return innerText;
else return textContent;

Я не хочу использовать функцию для этого материала. Также, пожалуйста, скажите мне название этой «вещи», если она существует, поскольку я с ней не знаком.

1. Ах да, жестокая любовница… у него много имен, в зависимости от того, откуда вы родом. Я из jQuery , и это называется .text() . В обычном JS вы всегда можете использовать var x=document.body.innerText?document.getElementById(id).innerText:document.getElementById(id).textContent;

2. Да, я знаю это, но поскольку я буду ссылаться много раз и с разными идентификаторами, я не хочу проверять это все время. Я хочу создать свойство, которое является кроссбраузерным. И, по-видимому, до сих пор лучшим ответом является ответ Энди.

Ответ №1:

Если вам нужно обратиться к innerText или textContent несколько раз, вы можете сделать что-то вроде этого:

 // Check which is supported:
var textProp = "textContent" in document.body ? "textContent" : "innerText";

// And when you need it:
var text = document.getElementById("myId")[textProp];

1. @Shaokan: Нет проблем. Не забывайте, что между innerText и textContent есть некоторые небольшие различия 🙂

2. Да, я знаю 🙂 но мне нужен текст внутри paragraph, и innerHTML не отклоняет их. Поскольку Firefox не использует innerText, самое близкое к тому, что я хочу, — это textContent 🙂 Еще раз спасибо

Ответ №2:

В общем, то, что вам нужно, называется «получателями» (а для установки текста — «установщиками»). Документацию см., например, в MDC

На DOM-узлах IE ненадежно поддерживает добавление таких свойств (по крайней мере, до IE8, см. Этот документ MSDN). Однако Webkit (Chrome) и Gecko (Firefox), похоже, с радостью позволят вам модифицировать прототипы DOM. Что оставляет вас с:

 try {
    if (!('innerText' in HTMLElement.prototype)) {
        HTMLElement.prototype.__defineGetter__("innerText", function() { return this.textContent; });
    }
} catch (ex) {/*uh oh*/}

Вы могли бы использовать аналогичный синтаксис для определения установщика:

 HTMLElement.prototype.__defineSetter__("innerText", function(newVal) { return this.textContent = newVal; });

Хотя это может сработать, я бы все же настоятельно рекомендовал использовать библиотеку по вашему выбору (jQuery, Prototype, MooTools, YUI, что угодно) для такого рода вещей. Конечно, вы можете заставить подобные вещи работать самостоятельно, но в большинстве случаев ваши усилия лучше потратить на написание вашего реального приложения.

1. Большое спасибо. Несмотря на то, что ответ Энди был самым близким к вашему ответу, я переношу правильный ответ от него к вам, поскольку вы отлично ответили на мой вопрос 🙂 Это было именно то, что я искал.

2. @Shaokan, Gijs: обратите внимание, что __defineSetter__ и __defineGetter__ оба являются нестандартными и могут не определяться в браузерах, которые поддерживают textContent только; например, в веб-браузере BlackBerry. В будущем он также может быть удален из некоторых браузеров в пользу стандартного Object.defineProperty() метода.

Ответ №3:

Внедрите jQuery, а затем просто используйте $('#' id).text() .

Это единственный правильный способ. В то время как JavaScript позволяет вам определять свойства, у которых есть средство получения, расширение объектов хоста (а узлы DOM являются объектами хоста) может привести к неопределенному поведению.

1. Спасибо за ответ, чувак, но я тоже не хочу использовать jQuery 🙂

2. Тогда вам придется остаться с уродливым кодом, который возвращает любое свойство, имеющее значение.

Ответ №4:

Не уверен, какую «вещь» вы имеете в виду, но вы можете использовать логическое ИЛИ для извлечения текста:

 var text = x.textContent || x.innerText;

Это возвращает, x.innerText если x.textContent не определено (и x.textContent если оно определено). Это очень распространенный ярлык.

Назначение немного сложнее, и я даже не уверен, можно ли назначить этим свойствам. Однако, если вы сможете, то это будет иметь тот же эффект, что и присвоение innerHTML (кроме, возможно, рендеринга HTML), а именно замена всего содержимого заданной строкой.
Но innerHTML поддерживается в каждом браузере и, следовательно, проще в использовании.

1. Да, я не уверен ни в том, что это за «вещь». Я не уверен, даже если он существует, лол. Вот почему я не знаю, как спросить 🙂

2. Вероятно, более уместно использовать его innerText в качестве запасного варианта, поскольку между ним и textContent и всеми основными версиями браузера edge сейчас есть небольшие различия, которые поддерживают textContent .

3. @AndyE: Да, на самом деле я больше не был уверен в порядке … обновлено.

Ответ №5:

либо вам нравится

 var x = elem.innerText || elem.textContent || "";

или просто используйте jquery и позвольте ему обрабатывать это за вас

 var x = $('myElement').text();