`
asyuanbo
  • 浏览: 4442 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

jquery append执行script脚本

 
阅读更多

jquery append事件会执行内容的script脚本;

eg:

$('#test').append("<script>alert(123);</script>")

 查看Jquery源码:

function domManip( collection, args, callback, ignored ) {

	// Flatten any nested arrays
	args = concat.apply( [], args );

	var first, node, hasScripts,
		scripts, doc, fragment,
		i = 0,
		l = collection.length,
		iNoClone = l - 1,
		value = args[ 0 ],
		isFunction = jQuery.isFunction( value );

	// We can't cloneNode fragments that contain checked, in WebKit
	if ( isFunction ||
			( l > 1 && typeof value === "string" &&
				!support.checkClone && rchecked.test( value ) ) ) {
		return collection.each( function( index ) {
			var self = collection.eq( index );
			if ( isFunction ) {
				args[ 0 ] = value.call( this, index, self.html() );
			}
			domManip( self, args, callback, ignored );
		} );
	}

	if ( l ) {
		fragment = buildFragment( args, collection[ 0 ].ownerDocument, false, collection, ignored );
		first = fragment.firstChild;

		if ( fragment.childNodes.length === 1 ) {
			fragment = first;
		}

		// Require either new content or an interest in ignored elements to invoke the callback
		if ( first || ignored ) {
			scripts = jQuery.map( getAll( fragment, "script" ), disableScript );
			hasScripts = scripts.length;

			// Use the original fragment for the last item
			// instead of the first because it can end up
			// being emptied incorrectly in certain situations (#8070).
			for ( ; i < l; i++ ) {
				node = fragment;

				if ( i !== iNoClone ) {
					node = jQuery.clone( node, true, true );

					// Keep references to cloned scripts for later restoration
					if ( hasScripts ) {

						// Support: Android<4.1, PhantomJS<2
						// push.apply(_, arraylike) throws on ancient WebKit
						jQuery.merge( scripts, getAll( node, "script" ) );
					}
				}

				callback.call( collection[ i ], node, i );
			}

			if ( hasScripts ) {
				doc = scripts[ scripts.length - 1 ].ownerDocument;

				// Reenable scripts
				jQuery.map( scripts, restoreScript );

				// Evaluate executable scripts on first document insertion
				for ( i = 0; i < hasScripts; i++ ) {
					node = scripts[ i ];
					if ( rscriptType.test( node.type || "" ) &&
						!jQuery._data( node, "globalEval" ) &&
						jQuery.contains( doc, node ) ) {

						if ( node.src ) {

							// Optional AJAX dependency, but won't run scripts if not present
							if ( jQuery._evalUrl ) {
								jQuery._evalUrl( node.src );
							}
						} else {
							jQuery.globalEval(
								( node.text || node.textContent || node.innerHTML || "" )
									.replace( rcleanScript, "" )
							);
						}
					}
				}
			}

			// Fix #11809: Avoid leaking memory
			fragment = first = null;
		}
	}

	return collection;
}

 hasScripts帮你执行脚本。

如果不想执行(防xss注入之类):

1、转义<script>标签

2、过滤掉<script>

3、<script type='text'>

分享到:
评论

相关推荐

    jQuery脚本文件

    - **引入jQuery**:在HTML文件中通过`&lt;script&gt;`标签引入jQuery库,通常从CDN链接加载,例如:`&lt;script src="https://code.jquery.com/jquery-3.x.x.min.js"&gt;&lt;/script&gt;`。 - **编写jQuery代码**:使用`$(document)....

    jQuery的使用,简化script函数

    "jQuery的使用,简化script函数"这个主题主要涵盖了如何利用jQuery来优化和简化传统的JavaScript代码。 首先,jQuery的核心在于选择器(Selectors),它允许开发者以CSS样式的方式选取HTML元素,如`$("#myID")`选取...

    JQUERY 一个强大的脚本库

    - **遍历**:JQuery 提供了`.each()`函数,允许开发者遍历集合中的每个元素并执行特定操作。 - **操作属性**:通过`.attr()`和`.removeAttr()`,可以方便地设置或移除元素的属性。 - **插入/删除元素**:`.append...

    jquery-2.1.4.js

    比如,使用`$(document).ready()`来确保文档加载完毕后再执行代码,或者使用`$('selector').action()`来选择元素并执行相应的动作,如`click()`、`append()`等。 jQuery在JavaScript JSP HTML的环境中起着桥梁的...

    jquery引用文件——jquery.js

    确保引入jQuery的脚本位于`&lt;head&gt;`标签内或`&lt;body&gt;`标签的底部,以确保在其他JavaScript代码执行前jQuery已经加载完成。 四、jQuery的基本用法 1. DOM操作: jQuery的语法以"$"开头,如`$(selector)`表示选择元素...

    常用的几个jquery版本文件

    - 引入jQuery库:在HTML文件中通过`&lt;script&gt;`标签引入jQuery文件,如`&lt;script src="jquery-x.x.x.min.js"&gt;&lt;/script&gt;`,确保引入位置在所有依赖jQuery的脚本之前。 - jQuery选择器:使用 `$` 符号进行DOM元素选择,...

    jQuery1.12.4.js

    1. **引入库**:在HTML中通过`&lt;script&gt;`标签引入jQuery 1.12.4.js文件,确保在其他依赖jQuery的脚本之前加载。 2. **$(document).ready()**:页面加载完成后执行的函数,确保DOM完全加载后才运行jQuery代码。 3. *...

    jQuery/jquery-1.7.2.min.js jquery-1.7.2.js 文件

    要在网页中使用jQuery,通常需要在HTML文档的`&lt;head&gt;`部分引入jQuery库的脚本文件,然后在`&lt;script&gt;`标签中编写jQuery代码。例如: ```html &lt;!DOCTYPE html&gt; &lt;title&gt;jQuery示例 &lt;script src="jquery-1.7.2....

    jquery-10分钟入门

    在HTML文件中,通常通过`&lt;script&gt;`标签引入jQuery库,如`&lt;script src="https://code.jquery.com/jquery-3.x.x.min.js"&gt;&lt;/script&gt;`,然后才能使用jQuery的方法。 8. **示例代码**: 一个简单的jQuery代码示例: `...

    JQuery1.2.chm

    在《JQuery1.2.chm》中,`jquery.js`文件是jQuery库本身,它是实际应用中引入jQuery的脚本文件。在网页中,通常通过在`&lt;head&gt;`或`&lt;body&gt;`标签内加入`&lt;script&gt;`标签来引用这个文件,如: ```html &lt;script src="jquery...

    jquery 实例 经典呀

    使用 `$(document).ready()` 或 `$(function() {...})` 缩短 DOM 加载与脚本执行的时间差,以及使用事件委托可提高效率。 10. **学习资源**: 学习 jQuery,你可以参考官方文档,参与在线课程,或者阅读各种教程书籍...

    jquery类库和引入类库代码

    例如,使用`$(document).ready()`或简写形式`$(function() {...})`确保在页面加载完成后执行jQuery代码: ```html &lt;script&gt; $(function() { // 在这里编写jQuery代码 $("button").click(function() { alert(...

    jquery-3.4.1.rar

    1. **引入jQuery**:可以将jQuery库通过CDN链接或者本地文件引入,如`&lt;script src="jquery-3.4.1.min.js"&gt;&lt;/script&gt;`。 2. **选择器与遍历**:通过选择器选取元素后,可使用`.each()`遍历,如`$('div').each...

    jquery 1.12.4.min.js

    确保在其他自定义脚本之前加载jQuery,以利用其提供的各种功能。 总之,jQuery 1.12.4.min.js作为一款成熟的JavaScript库,以其强大的功能和良好的兼容性,为Web开发者提供了极大的便利。在系统漏洞升级和维护旧...

    asp+jquery

    &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt;&lt;/script&gt; ``` 这使得我们可以利用jQuery的简便API来处理DOM元素和进行AJAX通信。 二、添加功能 1. ASP服务器端处理:创建一个表单,收集用户输入,...

    jquery-3.1.1和jquery-min-3.1.1打包

    - **性能优化**:在3.1.1版本中,jQuery对一些常用函数进行了性能优化,如`$.each()`和`$.ajax()`,提升了脚本执行速度。 - **ES6支持**:jQuery 3.x 开始支持ES6语法,这使得开发者可以使用新的JavaScript特性进行...

    jquery-1.10.2.min.js

    1. **引入方式**:通常我们会通过`&lt;script&gt;`标签引入jQuery库,确保在其他依赖jQuery的脚本之前加载。 2. **命名冲突**:为了避免与现有JavaScript代码产生命名冲突,jQuery提供了`$`和`jQuery`两个别名,可以使用`...

    jquery.js和jquery.cookie.js

    通常会将其放置在`&lt;head&gt;`部分,或者在`&lt;body&gt;`底部,以确保页面元素加载完毕后再执行jQuery代码。 2. **jQuery的选择器** jQuery提供了一套强大的选择器系统,可以方便地选取DOM元素。例如,`$("#id")`用于选取ID...

    jquery.min.js,很好用的基础插件

    确保在其他依赖jQuery的脚本之前引入,以便正确执行。 总的来说,`jquery.min.js`是Web开发中不可或缺的工具,它让JavaScript编程变得更为简洁、高效,极大地推动了前端开发的进步。无论你是初学者还是经验丰富的...

    jQuery实现图片预览功能

    接下来,我们引入jQuery库(这里使用的是CDN链接)和自定义的`imagePreview.js`脚本,这个脚本将包含实现图片预览功能的代码。 在`js/imagePreview.js`文件中,我们可以编写以下JavaScript代码: ```javascript $...

Global site tag (gtag.js) - Google Analytics