在循环中,我使用
$(".somediv").append(wordArray[i]+" ");
Run Code Online (Sandbox Code Playgroud)
在单词数组中有一些<p>和</p>标签。如果添加了它们,jQuery 似乎会自动使用</p>.
我怎样才能防止它这样做?
小智 5
您不使用 jquery 附加标签,而是附加节点。您正在操作的文档不是像<html><head><title>T</title></head><body><div id="D"><p>P</p></div></body></html>. 它像一棵树
HTML Element
+---HEAD Element
| `---TITLE Element
| `---Text node, contents: "T"
`---BODY Element
`---DIV Element, attributes: "id" => "D"
`---P Element
`---Text node, contents: "P"
Run Code Online (Sandbox Code Playgroud)
没有办法在树中表示“未关闭的标签”或“未完成的元素”。只有完整的元素才能存在。
旧document.write方法以字符串的形式对文档进行操作,可以追加任意片段,但使用上有明显的缺点。从DOM-level-0“标签思维”到现代DOM“树思维”的转变是使用jquery的先决条件。
您需要决定在添加开始标记的时间和添加结束标记的时间之间的时间间隔内,您希望树如何查看。这是一个可能的答案:添加隐式结束标记,然后每次追加时从头开始重建字符串,如下所示:
$(".somediv").html(wordArray.slice(0,i+1).join(" "));
Run Code Online (Sandbox Code Playgroud)
这样 if wordArrayis["foo","<p>","bar","baz","</p>","quux"]循环将像这样工作:
i string passed to html() equivalent HTML with all tags shown
0 "foo" "foo"
1 "foo <p>" "foo<p></p>"
2 "foo <p> bar" "foo<p>bar</p>"
3 "foo <p> bar baz" "foo<p>bar baz</p>"
4 "foo <p> bar baz </p>" "foo<p>bar baz</p>"
5 "foo <p> bar baz </p> quux" "foo<p>bar baz</p>quux"
Run Code Online (Sandbox Code Playgroud)
请注意,当</p>添加来自您的输入时,它不起作用。而且添加的<p>效果也不明显。所以也许如果每个元素都wordArray包含一些文本会更好:["foo","<p>bar","baz</p>","quux"]
它看起来有点笨拙,但这就是尝试使用不完整的 HTML 元素作为输入格式的结果!树思维! 为将来!
| 归档时间: |
|
| 查看次数: |
4127 次 |
| 最近记录: |