使用 js 变量在 p 标签内设置文本答案

【问题标题】：Setting text within p tag with js variable使用 js 变量在 p 标签内设置文本
【发布时间】：2015-11-04 15:57:25
【问题描述】：

我将 p 标签内的文本值设置为通过拆分解析出的字符串。当我提醒变量时，我可以看到文本，但是当我尝试将文本设置为变量值时，我看不到变化。如何编辑此代码以将 #view_head 中的文本设置为我在 $('#view_head').text(//variable here//) 中传递的变量？

代码

 $(edit_but).click(function(e){ //on add input button click
        //e.preventDefault();
        //uses set input data to create variables for use in editor
        var master_string = $('#string_text').text();
        var key_string = master_string.split("|m|");
        var name_string = key_string[0].split("|s|");
        var cont_string = key_string[1].split("|s|");//contains contact variables
        var adr_string = key_string[2].split("|s|");
        var qual_string = key_string[3].split("|s|");//contains description and applying for blob text
        var pos_key_string = key_string[4].split("|s|");
        var edu_key_string = key_string[5].split("|s|");//key string to contain edu strings
        var course_key_string = key_string[6].split("|s|");
        var awd_key_string = key_string[7].split("|s|");
        var skill_key_string = key_string[8].split("|s|");
        var count_key_string ='';


        var pos_string = pos_key_string[0].split("|j|");

        alert (pos_key_string);   //working
        alert (name_string);
        $('#view_head').text(key_string); //not working, does not change
        alert (key_string); //working, can see value in alert for both


        //window.location = '#openModal';
    });

【问题讨论】：

使用 sn-p 编辑器创建一个实际示例。现在我们只是猜测。您正在提醒 pos_key_string 但在 text() 中使用 key_string。你有id="view_head" 的标签吗？
是的，我有一个带有“view_head”的 p 标签，我正在尝试将该标签中的文本内容设置为 JavaScript 中的变量。他们警报很好，但 js 不会更改 p 标签内的文本。
String.split() 返回一个数组，text() 等待Type: String or Number or Boolean。努力做到$('#view_head').text(key_string.toString());
我担心是这样，所以当 .text 需要一个字符串时，我一直在传递一个字符串变量。 toString 是否应该将数组转换为对文本有效的可读字符串？
你能举个例子吗？

标签： javascript jquery dom string-split

【解决方案1】：

String.split() 返回一个数组，.text() 等待Type: String or Number or Boolean. - http://api.jquery.com/text/

如果您要查找的数据位于第一个数组元素中，请尝试获取 $('#view_head').text(key_string.toString()); 或 $('#view_head').text(key_string[0]);。

【讨论】：

【解决方案2】：

如果 text() 不起作用，也许你可以试试 val() 或 html()

【讨论】：

【解决方案3】：

使用 String.split() 返回一个 Array 对象，您不能将其作为文本插入到 HTML 元素中。要从可以插入 HTML 元素的数组创建字符串，请使用 Array.join() 方法。例如。

var sample_string = "This is a String";

// split at spaces into an Array
var sample_array = sample_string.split(' ');
//--> ['This','is','a','String']

// join with spaces into a String
var another_string = sample_array.join(' ');
//--> "This is a String"

参见 MDN：String.prototype.split() & Array.prototype.join()

【讨论】：