html中的特殊字符如何源码输出

要实现HtML中特殊字符不被转义（源码输出），有以下三种方法：方法一：

（推荐教程：html教程）

将HTML代码嵌入到script tyPE='text/html' style='display:block'> /scipt> 中

script type='text/html' style='display:block'>
     input type="text" />
     /scipt>
    

举例：

	body>
    		PRe>
    		script type="text/html" style="display: block;
    ">
    			div>
    哈哈哈/div>
    			h4>
    DFdfd/h4>
    		/script>
    		/pre>
    	/body>
    

方法二：

有时候想让一些html的标签不被浏览器解释翻译，直接原样的显示出来，这时可以在想要显示的代码的外面加上XMp> /xmp> ，这样xmp> 标签里面的内容将原封不动的显示出来。

xmp>
     	table>
    		tr>
    			th width="140">
    a/td>
    			th width="140">
    b/td>
    			th width="140">
    c/td>
    		/tr>
    	/table>
    /xmp>
    

方法三：

动态创建html时，有时需要某些内容源码显示，不进行html解析：

1、input和textarea通过js设置value值，不会对特殊字符(& quot; )进行html解析

2、input和textarea直接写在value，会对特殊字符(& quot; )进行html解析

3、input和textarea通过jquery设置value值，不会对特殊字符(& quot; )进行html解析

4、通过js或者jquery创建input和textarea，直接通过字符串拼接value，会对特殊字符(& quot; )进行html解析

5、通过js或者jquery创建input和textarea，通过js或者jquery设置value，不会对特殊字符(& quot; )进行html解析6.通过js或者jquery创建textarea，通过js(innerHTML)或者jquery（html()）设置value，会对特殊字符(& quot; )进行html解析7.js或者jquery添加script需要特殊处理，并且type='text/html'代表源码输出，不及进行html解析渲染

举例：

!DOCTYPE html>
    html>
    head>
    meta charset="utf-8">
     tITle>
    菜鸟教程(runoob.COM)/title>
     script src="https://cdn.statiCFile.org/jquery/1.8.3/jquery.min.js">
    /script>
    script>
$(function() {
    	//1.input和textarea通过js设置value值，不会对特殊字符(&
    quot;
    )进行html解析	document.getElementById("t1").value="&
    quot;
    ";
    	document.getElementById("t2").value="&
    quot;
    ";
    	alert("t1:" + document.getElementById("t1").value);
    //&
    quot;
    	alert("t2:" + document.getElementById("t2").value);
    //&
    quot;
    		//2.input和textarea直接写在value，会对特殊字符(&
    quot;
    )进行html解析	alert("t3:" + document.getElementById("t3").value);
    //"	alert("t4:" + document.getElementById("t4").value);
    //"		//3.input和textarea通过jquery设置value值，不会对特殊字符(&
    quot;
    )进行html解析	$("#t5").val("&
    quot;
    ");
    	$("#t6").val("&
    quot;
    ");
    	alert("t5:" + $("#t5").val());
    //&
    quot;
    	alert("t6:" + $("#t6").val());
    //&
    quot;
    			VAR str = "&
    quot;
    ";
    		//4.通过js或者jquery创建input和textarea，直接通过字符串拼接value，会对特殊字符(&
    quot;
    )进行html解析	var t9 = 't10textarea id="t9">
    ' + str + '/textarea>
    br>
    br>
    ';
    	$("#div1").append(t9);
    	alert("t10:" + $("#t10").val());
    //"		//5.通过js或者jquery创建input和textarea，通过js或者jquery设置value，不会对特殊字符(&
    quot;
    )进行html解析	var t10 = 't10textarea id="t10">
    /textarea>
    br>
    br>
    ';
    	$("#div1").append(t10);
    	$("#t10").val(str);
    	alert("t10:" + $("#t10").val());
    //&
    quot;
    		//6.通过js或者jquery创建textarea，通过js(innerHTML)或者jquery（html()）设置value，会对特殊字符(&
    quot;
    )进行html解析	var t11 = 't11textarea id="t11">
    /textarea>
    br>
    br>
    ';
    	$("#div1").append(t11);
    	$("#t11").html(str);
    	alert("t11的text:" + $("#t11").text());
    //"	alert("t11的val:" + "t11.val()=" + $("#t11").val());
    //"		//7.js或者jquery添加script需要特殊处理，并且type='text/html'代表源码输出，不及进行html解析渲染 	$("#div1").append("script type='text/html' style='display:block'" +">
    " + "&
    quot;
    /" + "script>
    ");
 	}
    );
    /script>
    /head>
    body>
    	t1input type="text" id="t1" value=""/>
    br>
    br>
    	t2textarea id="t2">
    /textarea>
    br>
    br>
    		t3input type="text" id="t3" value="&
    quot;
    "/>
    br>
    br>
    	t4textarea id="t4">
    &
    quot;
    /textarea>
    br>
    br>
    		t5input type="text" id="t5" value=""/>
    br>
    br>
    	t6textarea id="t6">
    /textarea>
    br>
    br>
    		div id="div1">
    /div>
    /body>
    /html>
    

以上就是html中的特殊字符如何源码输出的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！