目的

html绑定可以绑定DOM元素内的HTML内容。

示例:

<div data-bind="html: details"></div>

<script type="text/javascript">
var viewModel = {
details: ko.observable() // Initially blank
};
viewModel.details("<em>For further details, view the report <a href='report.html'>here</a>.</em>"); // HTML content appears
</script>

参数

  • Main parameter
  • KO在绑定时会把元素内原来的HTML内容清除掉。如果JQuery是可用的,KO会使用JQuery的html函数进行绑定,或者把参数的字符串做为HTML绑定到每一个子元素中。
  • 如果参数是observable的,那么当参数值更改时会动态的更新HTML的内容。否则,只会在第一次进行绑定,后面参数值改变不会对HTML内容产生任何影响。

如果参数传的不是字符串,innerHTML会把参数进行toString()后做为HTML进行绑定。

  • Additional parameters
  • None

注:关于HTML编码

使用innserHTML会产生脚本注入的风险,所以如果不确定要显示的内容,建议使用text绑定。

html绑定的更多相关文章

  1. ASP.NET Core MVC/WebAPi 模型绑定探索

    前言 相信一直关注我的园友都知道,我写的博文都没有特别枯燥理论性的东西,主要是当每开启一门新的技术之旅时,刚开始就直接去看底层实现原理,第一会感觉索然无味,第二也不明白到底为何要这样做,所以只有当你用 ...

  2. MVVM设计模式和WPF中的实现(四)事件绑定

    MVVM设计模式和在WPF中的实现(四) 事件绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  3. MVVM模式解析和在WPF中的实现(三)命令绑定

    MVVM模式解析和在WPF中的实现(三) 命令绑定 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二)数据绑定 MVVM模式解析和在WPF中 ...

  4. 冒泡,setinterval,背景图的div绑定事件,匿名函数问题

    1.会冒泡到兄弟元素么? $(function(){ $("#a").click(function(){alert("a")}) $("#b" ...

  5. Xamarin+Prism开发详解二:Xaml文件如何简单绑定Resources资源文件内容

    我们知道在UWP里面有Resources文件xxx.resx,在Android里面有String.Xml文件等.那跨平台如何统一这些类别不一的资源文件以及Xaml设计文件如何绑定这些资源?应用支持多国 ...

  6. 数据的双向绑定 Angular JS

    接触AngularJS许了,时常问自己一些问题,如果是我实现它,会在哪些方面选择跟它相同的道路,哪些方面不同.为此,记录了一些思考,给自己回顾,也供他人参考. 初步大致有以下几个方面: 数据双向绑定 ...

  7. Html.DropDownLis绑定数据库

    效果: 方法一: View: <div class="col-md-md-4"> <div class="input-group"> & ...

  8. ASP.NET MVC——模型绑定

    这篇文章我们来讲讲模型绑定(Model Binding),其实在初步了解ASP.NET MVC之后,大家可能都会产生一个疑问,为什么URL片段最后会转换为例如int型或者其他类型的参数呢?这里就不得不 ...

  9. Spring MVC初始化参数绑定

    初始化参数绑定与类型转换很类似,初始化绑定时,主要是参数类型 ---单日期 在处理器类中配置绑定方法  使用@InitBinder注解 在这里首先注册一个用户编辑器 参数一为目标类型   proper ...

  10. SpringMVC初始化参数绑定--日期格式

    一.初始化参数绑定[一种日期格式] 配置步骤: ①:在applicationcontext.xml中只需要配置一个包扫描器即可 <!-- 包扫描器 --> <context:comp ...

随机推荐

  1. Android 下载模块分析(DownloadManager和DownloadProvider)

    Android下载模块主要有2个部分组成:DownloadManager和DownloadProvider:其中DownloadManager提供接口供调用,具体的实现是 DownloadProvid ...

  2. 判断0-N之间出现1的次数

    Console.WriteLine("请输入截止数字?退出请输入y"); string input = Console.ReadLine(); int n = Convert.To ...

  3. 绘制基本图形和线型(StrokeStyle)的设置详解

    绘制基本图形和线型(StrokeStyle)的设置详解 目前,在博客园上,相对写得比较好的两个关于Direct2D的教程系列,分别是万一的Direct2D系列和zdd的Direct2D系列.有兴趣的网 ...

  4. .NET中 类型,对象,线程栈,托管堆在运行时的关系

    .NET中 类型,对象,线程栈,托管堆在运行时的关系 The Relationship at Run Time between Types,Objects,A Thread's Stack,and T ...

  5. Nginx学习之十四-GDB调试Nginx初试

    本文的测试环境: Win7+虚拟机VMWareVMware-workstation-full-7.1.4-385536+Ubuntu12.04 Nginx-1.4.0 要想有效的研究Nginx源码,必 ...

  6. 算法之prim算法

    最小生成树是数据结构中图的一种重要应用,它的要求是从一个带权无向完全图中选择n-1条边并使这个图仍然连通(也即得到了一棵生成树),同时还要考虑使树的权最小. prim算法就是一种最小生成树算法. 普里 ...

  7. Ubuntu12.10 下搭建基于KVM-QEMU的虚拟机环境(三)

    原则上来说,qemu, libvirt, libusb, usbredir, spice等都可以通过 apt-get install的方式从Ubuntu源在线安装.但是这样如果碰到一点问题,就比较难办 ...

  8. Arrays类——Arrays.asList()方法使用

    java.util类 Arrays java.lang.Object——java.util.Arrays public class Arrays extends Object 此类包含用来操作数组(比 ...

  9. Eclipse 中,web项目在Tomcat运行时填写不了Server name

    最近开发项目,从MyEclipse中导入项目到Eclipse中,那些WEB属性都在,可就是不能在Tomcat上运行.纠结一番,最后发现是这个问题: WEB的版本问题. 具体问题看下图: 解决方案: W ...

  10. jquery开头

    jQuery(function(){});jQuery().ready(function(){}); 绑定点击事件: jQuery('#temp').click(function() {}); $(d ...