Встраивать необработанные данные в HTML для анализа в jQuery

Question

Большую часть своей карьеры я живу в мире настольных компьютеров, поэтому простите меня за такой простой вопрос, но я не совсем уверен, с чего начать.

Я хочу вернутьсянекоторые необработанные данные вместе с моим HTML, а также разбор и отображение данных с помощью jQuery, как только HTML будет готов.Я примерно знаю, как должен выглядеть мой js-код, но я не уверен, как мне встраивать необработанные данные в мой HTML.

Я мог бы использовать $ .getJSON (), но было бы лучше, если быУ меня могут быть данные прямо в моем HTML.

Я думаю, что json или XML будут работать, но как правильно их экранировать / вставлять / анализировать, когда они встроены в HTML?

Заранее спасибо.

Answer 1

Вы можете поместить данные JSON в скрытый div, затем декодировать и использовать из jQuery.

Например, мы возьмем:

{"foo":"apple","bar":"orange"}

Escape и поместите вdiv:

<div id="data">%7B%22foo%22%3A%22apple%22%2C%22bar%22%3A%22orange%22%7D</div>

Тогда из jQuery мы можем использовать данные:

var data = jQuery.parseJSON(unescape($("#data").html()));

Так что вызов alert(data.foo) даст нам apple.

Вот рабочий пример.

Answer 2

Где и когда вам нужны эти данные?

Если вы хотите, чтобы они отображались в вашем представлении, просто передайте данные в представление

Действие / Контроллер:

public ActionResult MyAction()
{
    ViewData["MyData"] = "this is a sample data of type string";
    return View();
}

А потом, где-то в вашем представлении:

<script>
    var data = '<%= ViewData["MyData"] %>';
    $(document).ready(){
        alert(data);
    }
</script>
<h1><%: ViewData["MyData"] %></h1>

Конечно, если вы работаете с List<string> или `string [] ', вам нужно будет отформатировать его в соответствующий JavaScript для jQueryчтобы понять это.

<script>
     var dataArray = [

     <% foreach(string s in (string[])ViewData["MyDataArray"]){ %>
        <%= s %>,
     <% } %>   
     ];
</script>

Было бы хорошо, если бы вы генерировали правильный JavaScript в действии вместо представления, чтобы избежать уродливой разметки в вашем представлении:

public ActionResult MyAction()
{
    string[] myArray = new string[]{ "hello", "wolrd" };
    ViewData["MyData"] = myArray;
    ViewData["JavaScriptArray"] = "[" + myArray.Aggregate((current,next) => string.Format("'{0}','{1}',", current, next).TrimEnd(new char[] { ','})) + "]";
    // or you can use your favorite JavaScript serialize
    return View();
}

Теперь вы можетесделайте следующее на ваш взгляд:

<script>
    var dataArray = <%= ViewData["MyJavaScriptArray"] %>;
    alert(dataArray[0]); // alerts 'hello'
</script>

Answer 3

Как вы сказали, вероятно, лучше всего получить его через Ajax, используя $ .post или $ .get или $ (element) .load () и т. Д. *

Но если вы должны сохранить его на странице, то обычно это сохранение в скрытом поле. Asp.net сохраняет вещи в скрытых полях, используя двоичную сериализацию и Base64, но вы можете сохранить его в виде строки Json, а затем использовать в своем JS.