首页 > web前端 > js教程 > 正文

jquery怎么输出html代码

coldplay.xixi
发布: 2020-11-17 15:07:29
原创
3211 人浏览过

jquery输出html代码的方法:1、直接输出标签元素,代码为【var form1 = "

"】;2、输出带变量的标签元素,代码为【var country =....】。

jquery怎么输出html代码

jquery输出html代码的方法:

形式一:直接输出标签元素

1.采用转义符号

var form1 = "<form id=\"myform\" method=\"post\" >"
+"<input type=\"text\" name=\"uname\"  style=\"height:20px;width:100%;\" />"
+"<input type=\"password\" name=\"pwd\" style=\"height:20px;width:100%;\" />"
+"</form>";
登录后复制

2.采用单引号

var form2  = &#39;<form id="myform" method="post" >&#39;
+&#39;<input type="text" name="uname"  style="height:20px;width:100%;" />&#39;
+&#39;<input type="password" name="pwd" style="height:20px;width:100%;" />&#39;
+&#39;</form>&#39;;
登录后复制

3.采用es6的模板字符量(不过我喜欢用模板字符串来称呼这个。。。)

就是在前后都加上了一个( ` ),它中间就写你要输出的东西,写标签就输出标签,写\n就表示换行,写变量的话是不会输出变量代表的值,而是把变量的名字给输出来。比如说变量country的值为“中国”,那么它不会输出中国这个值,而是country变量名,要输出值的话请看 形式二。

 var form3 = `<form id="myform" method="post">
    <input type="text" name="uname" style="height:20px;width:100%;" />
    <input type="password" name="pwd" style="height:20px;width:100%;" />
  </form>`
登录后复制

形式二:输出带变量的标签元素

1.采用转义符号

var country = "中国";
var table = "<table border=\"1\" style=\"width:100%;\">";
table += "<caption>国家信息列表</caption>";
table += "<thead><tr><th>ID</th><th>Name</th></tr></thead>";
table += "<tbody><tr><td>1</td><td>"+country+"</td></tr></tbody>";
table += "</table>";
登录后复制

2.采用单引号

var country = "中国";
var table = &#39;<table border="1" style="width:100%;">&#39;;
table += &#39;<caption>国家信息列表</caption>&#39;;
table += &#39;<thead><tr><th>ID</th><th>Name</th></tr></thead>&#39;;
table += &#39;<tbody><tr><td>1</td><td>"&#39;+country+&#39;"</td></tr></tbody>&#39;;
table += &#39;</table>&#39;;
登录后复制

3.采用es6的模板字符量(不过我喜欢用模板字符串来称呼这个。。。)

输出变量的值,比如上面说到的country=“中国”,那么要怎么才可以输出中国这个值呢?

其实可以用占位符来代表${ },括号中间的部分就写上你要输出变量所代表的变量名称。

var country = "中国";
var table = `<table border="1" style="width:100%;">`;
table += `<caption>国家信息列表</caption>`;
table += `<thead><tr><th>ID</th><th>Nane</th></tr></thead>`;
table += `<tbody><tr><td>1</td><td>${country}</td></tr></tbody>`;
table += `</table>`;
登录后复制

相关免费学习推荐:JavaScript(视频)

以上是jquery怎么输出html代码的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!